i want to add custom javascript to admin> product > add/edit >custom tabs like :price / general

what i want that there will be one drop down attribute on change of which i want to use ajax to autofill value in below textbox

for that i will be using ajax call on change of main dropdown

how can i do this.

i thought adding custom js code for that page only .

how can i do this i want magento like ajax loader when drop down change ?...

any help please could not find any proper guide or link for such case

  • Is the attribute already installed on the product, or do you need to create that attribute also? Nov 22, 2014 at 3:47
  • i have created attribute . just need ajax calling Nov 22, 2014 at 3:56

1 Answer 1


Since you have already created the attribute, you can add some layout XML to inject a helper script:

    <reference name="head">
        <action method="addJs">

For the product edit area only. You can place this in your related module's layout XML or else in app/design/adminhtml/default/default/layout/local.xml. So in the JS, I presume you'll be observing the change event of the target select element. On trigger, you'll make an AJAX call to ... ? I don't know that either, but if it's going to route back through Magento to get that information, you will likely need to also setup a controller.

Alternate Method

Another way to get the JS in place is to specify an "input renderer" when installing your attribute. Here's an article on how to do that: http://inchoo.net/magento/adding-magento-attribute-with-custom-input-renderer/

To summarize the article, install your attribute like so:

$installer->addAttribute(Mage_Catalog_Model_Product::ENTITY, 'example_field', array(
    'group'             => 'General',
    'type'              => 'text',
    'backend'           => '',
    'input_renderer'    => 'test/catalog_product_helper_form_example',

Notice the input_renderer field. This maps to a block which renders the form field for your attribute, like so:

class Namespace_Test_Block_Catalog_Product_Helper_Form_Example 
    extends Varien_Data_Form_Element_Text
    public function getAfterElementHtml()
        $html = parent::getAfterElementHtml();

        return $html . "<script>//your script here</script>";

You might not want to do this because your attribute is already installed, but I tend to prefer this method because of how tightly it couples the JS with the attribute.

  • hi, yeah one qsn as your 2 ans seems good what to do to use if i have already created attribute via admin > manage attributes ?? Nov 22, 2014 at 4:45
  • ahh, ok. In that case, the first solution is the one you want. Add that layout XML to the local.xml file. The script must be a path relative to your store's root /js folder (in the example shown above). Then clear your cache, load up the page edit screen, and check your developer tools to verify that the JS source was loaded. Nov 22, 2014 at 4:52
  • how can ajax in mageto style ?? in specific way of calling in that loader style. Nov 22, 2014 at 5:46
  • Magento uses Prototype JS to bootstrap AJAX requests, see api.prototypejs.org/ajax/Ajax/Responders -- this means that any time you call new Ajax.Request() the loader popup will appear automatically. Learn about AJAX in Prototype here: api.prototypejs.org/ajax/Ajax/Request Nov 22, 2014 at 5:53

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.