0

I want to add custom js in product edit page (Admin)

Is it ok to add it in some xml or is there any other way to do it?

If it is xml, which XML do I need to work on?

  • Yes you need to add in XML file. – Amit Naraniwal Feb 21 at 6:15
  • can you help me with the code? which xml do I need to edit? – Shoaib Munir Feb 21 at 6:21
2

I did some efforts on this and I think this solution is much better and easy to implement

Add XML file in a custom module

app\code\Vendor\Module\view\adminhtml\layout\catalog_product_edit.xml

File code will be:

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="admin-1column" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <head>
        <script src="Naheed_HomeProductsGrid::js/custom_product_edit.js"/>
    </head>
</page>

Add new js file in module view directory

app\code\Vendor\Module\view\adminhtml\web\js\custom_product_edit.js

File code will be:

require([
    'jquery'
], function ($) {
    'use strict';
    jQuery(document).ready(function(){
        //Custom js here
    });
});

And if you want to run js after all ajax call complete then use jQuery(document).ajaxStop() Code will be like this:

require([
    'jquery'
], function ($) {
    'use strict';
    jQuery(document).ready(function(){
        jQuery(document).ajaxStop(function () {
            //Custom js here
        });
    });
});
1

You can add requireconfig-js to load your customjs in any page of magento.

Full description in below link

Magento DevDocs

0

You can add your custom js file in the layout file : vendor\magento\module-catalog\view\adminhtml\layout\catalog_product_edit.xml

<?xml version="1.0"?>    
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
      xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <head>
        <link src="Magento_Catalog::js/customJsFile.js"/>
    </head>
</page>

After that create your customJsFile.js file in the web/js folder.

  • Your solution will work, but editing vendor file is not a good way of development. Thanks anyway for taking time in answering my question. +1 – Shoaib Munir Feb 21 at 7:09
  • @ShoaibMunir, yes definitely we should not edit core files, You can create your own module and create the above xml file there. – Amit Naraniwal Feb 21 at 7:15
  • Got your point. Thanks. I gave you +1 on your answer – Shoaib Munir Feb 21 at 7:16

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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