Include JS in browserview

I want to add some JS to a template of an addon being developed for plone5. I followed the docs at Exercise 1: Include a JavaScript resource TTW – JavaScript For Plone Developers (up to Plone 5) – Exercises — Plone Training 2022 2022 documentation.
As a utility function to add resource to rendered page, I added the following code to the class AddOnFolderView(BrowserView):

def call(self):
add_resource_on_request(self.request, 'ploneorg.addonlisting')
return super(AddOnFolderView, self).call()

where ploneorg.addonlisting is the name for the static resource directory

<browser:resourceDirectory
name="ploneorg.addonlisting"
directory="static"
/>

when I go to the respective browserView I get the following error

Traceback (innermost last):
Module ZPublisher.Publish, line 138, in publish
Module ZPublisher.mapply, line 77, in mapply
Module ZPublisher.Publish, line 48, in call_object
Module ploneorg.addonlisting.browser.views, line 41, in call
NameError: global name 'add_resource_on_request' is not defined

But,

from Products.CMFPlone.resources import add_resource_on_request

has been added to views.py. What could be wrong?

Because the import is missing which is correctly part of thr example.
-aj

I am no longer getting the import error, but the resource from the resource registery is not being accessed by the template. As mentioned before, I followed the example at Exercise 1: Include a JavaScript resource TTW – JavaScript For Plone Developers (up to Plone 5) – Exercises — Plone Training 2022 2022 documentation.

Following are the contents of registry.xml

<?xml version="1.0"?>
 <registry>

<value key="js">++resource++ploneorg.addonlisting/addonlist.js</value>
<value key="css">
    <element>++resource++ploneorg.addonlisting/addonlist.css</element>
</value>

</records>
</registry>

and addonlist.css and addonlist.js have been added in the static folder, which is configured as a resource directory in configure.zcml, as mentioned above.

When the corresponding browserView is opened, no css styles are applied and no js script is called. The registered resource is listed in the resource registry control panel of the plone site. what additional changes have to be made to include the css and js in the template?

Just a thought - have you set development mode in the resource registry?

1 Like

In the end, it seems that @pavithirakc had correctly set up the registry and her JS was being correctly served, but there was an incorrect CSS ID being referenced. We think fixing that ID will have addressed the issue.