How to use Django list as a javascript variable in Django template?

Question

I have a Django list by named list_a :

[['Host Name', 'No. of Events'], [u'12.23.21.23', 0], [u'2.152.0.2', 2]]

I am using Google Chart API in my Django template. I have to paas list_a to the following java script variable:

var data = google.visualization.arrayToDataTable([
    ['Host_name', 'No of events'], 
    ['12.23.21.23', 0], 
    ['2.152.0.2', 2]
    ]);

The above one is hard coded, but i want to use in the following way:

var data = google.visualization.arrayToDataTable({{list_a}});

I tried with the above code and checked with the javascript console option provided in chrome. It show this:

 var data = google.visualization.arrayToDataTable([['Host Name', 'No. of Events'], [u'12.23.21.23', 0], [u'2.152.0.2', 2]]);

I compared with this above line with the hard coded code, It is very different because of following way:

'
['12.23.21.23', 0]  See the quotes on ip address field but not to the next field

How should i make the list_a equivalent to the hard coded, So that i can easily get the required chart.

Apart from that why this &#39 is occurring when i tried to use it directly

I am using this https://google-developers.appspot.com/chart/interactive/docs/gallery/combochart sample of Google charts

Answer 1

Encode it as JSON, mark it safe, and print it out.

var data = google.visualization.arrayToDataTable({{ list_a|json|safe }})

Unfortunately you'll need to write or find the json filter, or encode it as JSON in the view.