Question

It has been 2day i am trying to figure out how to do that. I am a novice so please give as detailed explanation as possible.

I am doing this in my views.py

dict1 = simplejson.dumps(dict1)
return render_to_response('main_page.html', {
                    'js_testsuite':testsuite_dict,
                    'js_testset':js_testset,
                    'dict1':dict1})

In main_page.html

{% if js_testsuite %}               
<select id="testsuites" name="testsuite" onchange="setOptions(document.selection.testsuite.selectedIndex);">
    {% for key, value in js_testsuite.items %}
            <option value={{ value }} name="testsuite">{{ key }}</option>
    {% endfor %}
</select>
{% endif %}

In setoptions.js, which contains the function setOptions(value), to which i am passing selected index of the select box, and using this value i have to set the second select box and the data for this select box has to come from the views.py given above.
Also, I tried doing

var value_from_django = {{ dict1 }};

what are the other things im missing. Could you please provide a detailed explanation on this. I had been trying this for 2 days.

• Is there a way in which I can pass the value from django views to the javascript directly bypassing the django template?
• Can I pass the information from django views to the html template and then to the javascript?

The javascript I am referring to is a simple javascript not jquery.

Thanks for your support,

Vinay

Answer 1

You cannot pass values to javascript bypassing the template, unless you use an ajax call to start a separate request or unless you do something very unusual like embedding the data in a response header (don’t actually do this, it is not what response headers are for!). The response, which includes the header and the body (the body being the part generated by the template) is the sum total of the information your application provides to your client, so unless you generate an additional request and fetch an additional response with ajax, you have no other options.

If you don’t want to do that, then your options for passing information to the javascript via the template are basically the following:

• Using an inline tag, create properly formatted javascript dynamically via the templating system. The example line you have, var value_from_django = {{ dict1 }}; is essentially what I’m talking about here, except that I’m not sure you can pass a dict through from django to javascript like that, because django’s text output of a dict in the template is unlikely to be exactly the correct formatting for a javascript variable declaration. So, instead you can…
• Translate your data into JSON and put that into your template, and then process that with the javascript. (This is usually done with an ajax call, but there’s nothing stopping you from injecting the JSON data into the initial template directly.)
• Or populate your HTML with the data you want and then use javascript to locate the HTML tag containing the data and parse the data out.

If you are trying to pass simple variables like integers, it might be easiest to do it with the first or third options. If you are trying to pass a more complex data structure like a dictionary, you will probably be better off using JSON (that’s what it’s for!)

I would like to give you more detailed and concrete instructions, but for that you will need to post more detail about what exactly is going wrong with your current approach and what your desired functionality is.

By the way: if it is at all feasible to include jquery on this page and use that instead of trying to use basic javascript, you should do so. It will make your life much, much easier.