4

I have a file: etc/adminhtml/system.xml where I have added some form fields. However I need to add a custom script being executed while someone types in one of the fields.

How can I include a .js in this page? It appears I can't simply include it like I would do in a simple xml magento 2 page

<head>
 <css src="Vendor_Module::test.css"/>
 <link src="Vendor_Module::test.js"/>
</head>
asked Jul 11, 2017 at 21:06
5
  • 1
    This may help - magento.stackexchange.com/questions/131056/… Commented Jul 12, 2017 at 16:16
  • It does. I actually used requirejs-config.js (I posted it as a reply below). However in my case I wish to include the .js file only in the system page of my module, not in every single page of the admin panel. Any ideas on that? Commented Jul 13, 2017 at 13:33
  • I don't do any work in the admin so I can't help with that sorry, is there not layout XML you can use for the admin to target a specific page? Commented Jul 13, 2017 at 13:41
  • I haven't found anything yet. The view/adminhtml/layout/adminhtml_system_config_edit.xml that was suggested in the first reply didn't work... I keep searching though Commented Jul 13, 2017 at 13:43
  • I just added the file view/adminhtml/requirejs-config.js with my own code inside and it seems to be loaded in every single page of the admin panel. I don't like this practice, but it's the only thing working right now. I also get this error: Uncaught ReferenceError: config is not defined at requirejs-config.js:423 at requirejs-config.js:424 at requirejs-config.js:428 (anonymous) @ requirejs-config.js:423 (anonymous) @ requirejs-config.js:424 (anonymous) @ requirejs-config.js:428 Commented Jul 13, 2017 at 14:25

1 Answer 1

4

Create in one of your extensions the file view/adminhtml/layout/adminhtml_system_config_edit.xml and put your content in there.
adminhtml_system_config_edit is the layout handle for the configuration page.

answered Jul 11, 2017 at 21:09
4
  • Thank you but can you be more detailed? I don't have any files on the view/adminhtml folder, as my only page is set at the etc/adminhtml/system.xml so how do I declare that the system.xml has an external test.js file? I tried what you said and added file view/adminhtml/layout/adminhtml_system_config_edit.xml with the code: <layout version="0.1.0"> <adminhtml_system_config_edit> <reference name="head"> <action method="addJs"><file>test.js</file></action> </reference> </adminhtml_system_config_edit> </layout> but it wasn't included in the output Commented Jul 12, 2017 at 13:14
  • Maybe I should add the .js and .css in the etc/acl.xml file, or the etc/adminhtml/menu.xml file? Commented Jul 12, 2017 at 15:40
  • 1
    you cannot add js and css files from the system or acl xml files. They serve different purposes. You can add resources from the layout files as explained in the answer. For every configuration page the layout files named adminhtml_system_config_edit.xml will be loaded. that's where you can add your custom js or custom css. Commented Jul 12, 2017 at 15:46
  • OK but I would like some sample code please. Right now I tried to write some sample code in the view/adminhtml/layout/adminhtml_system_config_edit.xml but the .js file was not included Commented Jul 12, 2017 at 16:07

Your Answer

Draft saved
Draft discarded

Sign up or log in

Sign up using Google
Sign up using Email and Password

Post as a guest

Required, but never shown

Post as a guest

Required, but never shown

By clicking "Post Your Answer", you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.