You are here: Home Blog archive 2010 June 22 Injecting Plone variables into javascript

Injecting Plone variables into javascript

by Mike Cullerton — last modified Jun 22, 2010 09:00 AM

I needed access to Plone variables (specifically portal_url) from within javascript. So, I created a browser view and python script that outputs the necessary variables, and registered the view in jsregistry.xml. This turned out to be a rather simple solution.

 

Step 1: Create a class to output the javascript

I created a file in src/my.product/my/product/browser called CommonUtils.py and added a class GlobalJS with a __call__ method that returns a string containing the javascript. __call__ sets the content-type, creates the string containing the variable, and returns the string.

class GlobalJS(BrowserView):
 
    def __call__(self,REQUEST,RESPONSE):
        RESPONSE.setHeader('Content-Type', 'application/javascript')
        js_string = "var portal_url = '%s';" % (self.context.portal_url())
        return js_string

 

Step 2: Create a browser view pointing to the class

In src/my.product/my/product/browser/configure.zcml, I added a browser view pointing to GlobalJS, gave it a name, and added a permission. Note that the name of the file containing GlobalJS is CommonUtils.py

<browser:view 
     for="*"
     name="global_js.js" 
     class=".CommonUtils.GlobalJS"
     permission="zope2.View"
     />

 

Step 3: Register the view in javascript registry

Here, I register the browser view in src/my.product/my/product/profiles/default/jsregistry.xml. I needed access to portal_url before jquery was loaded, so I added the insert-before property. Note that the id is the same as the name registered in the browser view.

<javascript 
    id="global_js.js"
    cacheable="True" compression="safe" cookable="True"
    enabled="True" expression=""  inline="True" insert-before="jquery.js"/>

 

Now, global_js.js is loaded on every page and I have access to portal_url from within javascript.

Hope this helps someone.

Document Actions

JSON

Avatar Posted by Martin Aspeli at Jun 22, 2010 11:23 AM
Sometimes, you want to output more complicated variables, such as JavaScript objects (dicts) or arrays (lists).

In this case, you can use the built-in (in Python 2.6 at least - in 2.4, it's a third-party) module 'json', e.g. in your view's __call__():

return """\
var someData = %(someData)s;
var otherVar = %(otherVar)s;
""" % dict(
        someData = json.dumps(someData),
        otherVar = json.dumps(otherVar),
    )

Martin

Thanks for sharing

Avatar Posted by Noe Nieto at Jun 22, 2010 03:23 PM
Thanks For sharing!!

portal_url is built-in

Avatar Posted by Michael Dunlap at Jun 29, 2010 03:13 PM
You can access portal_url already with Plone because of the plone-javascript-variables.js that will include portal_url as one of its defined variables.

portal_url is built-in

Avatar Posted by Michael Dunlap at Jun 29, 2010 03:14 PM
That should be portal_javascript_variables.js

Add comment

You can add a comment by filling out the form below. Plain text formatting.

(Required)
Tell us your name.
(Required)
(Required)
(Required)
Enter the word
 
 
Copyright © 2003-2012 Core Software Group | 303/809-1001 | Fort Collins, Colorado | All rights reserved.