how to pass utf-8 data from Django to javascript

Question

I have the following key value object in Django:

data = {
    "id": 1,
    "question_text": "אנא בחר אחת מהתשובות הבאות",
    "answers": [
     {
        "label" : "תשובה 1",
        "value" : 1,
        "count" : 30
     },
     {
        "label" : "תשובה 2",
        "value" : 2,
        "count" : 30
     },
     {
        "label" : "תשובה 3",
        "value" : 3,
        "count" : 30
     },
}

Note that some of the data is in Hebrew so when I save it in to the DB I use:

unicode(self.answer_text).encode('utf-8')

When I tried to send this object to a view, in order to use it in a Django template and as well in Javascript

I have used this line:

return render(request, 'reports/report.html', {'data': data })

and in the view I used:

var question_data = {{ data }} #in order to get the data object that was sent to the view

But I get this element:

{&#39;bad&#39;: 45, &#39;good&#39;: 55, &#39;question_text&#39;: u&#39;\u05e2\u05d3 \u05db\u05de\u05d4 \u05d0\u05ea\u05d4 \u05de\u05e8\u05d5\u05e6\u05d4 \u05d0\u05d5 \u05dc\u05d0 \u05de\u05e8\u05d5\u05e6\u05d4 \u05de\u05d1\u05d2\u05d3\u05d9 \u05e2\u05dc\u05d9\u05ea \u05d1\u05d0\u05d5\u05e4\u05df \u05db\u05dc\u05dc\u05d9?&#39;, &#39;id&#39;: u&#39;8&#39;, &#39;answers&#39;: [{&#39;value&#39;: 30, &#39;label&#39;: u&#39;\u05de\u05d0\u05d5\u05d3 \u05de\u05e8\u05d5\u05e6\u05d4&#39;}, {&#39;value&#39;: 25, &#39;label&#39;: u&#39;\u05d3\u05d9 \u05de\u05e8\u05d5\u05e6\u05d4&#39;}, {&#39;value&#39;: 20, &#39;label&#39;: u&#39;\u05dc\u05d0 \u05db\u05dc \u05db\u05da \u05de\u05e8\u05d5\u05e6\u05d4&#39;}, {&#39;value&#39;: 25, &#39;label&#39;: u&#39;\u05db\u05dc\u05dc \u05dc\u05d0 \u05de\u05e8\u05d5\u05e6\u05d4&#39;}]}

and this error in the console:

SyntaxError: Unexpected token '&'. Expected a property name

I have also tried to use:

var question_data = {{ data|safe }}

and I got this error:

[Error] SyntaxError: Unexpected string literal '\u05e2\u05d3 ...

I'm using Django 1.7 and Python 2.7.6

Please try and help me understand what i'm doing wrong

laffuste · Accepted Answer · 2014-11-04 06:00:22Z

4

View

import json
# ....
return render(request, 'reports/report.html', {'data': json.dumps(data) })

Template

<script>
  var question_data = JSON.parse("{{ data|escapejs }}");
  console.log(question_data);
</script>

Also, you might have a syntax error in your python dict (missing closing bracket).

EDIT

return render(request, 'reports/report.html', {'data': data, 'data_json': json.dumps(data) })

edited Nov 4, 2014 at 6:00

answered Nov 3, 2014 at 4:55

laffuste

17.2k8 gold badges90 silver badges94 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

shlomiLan Over a year ago

But now when I tried to use {{ data.question_text }} I get an empty string, I would like to use this code instead of using Javascript for that

Yossi Over a year ago

You can't access json members in your template. Just add to your context another set of variables.

Diego Santa Cruz Mendezú · Accepted Answer · 2018-08-11 22:12:58Z

0

For show JSON fron Views Django, you must escape data with filter:

var categories = JSON.parse("{{ categories|escapejs }}");

answered Aug 11, 2018 at 22:12

Diego Santa Cruz Mendezú

4,6771 gold badge42 silver badges28 bronze badges

Collectives™ on Stack Overflow

how to pass utf-8 data from Django to javascript

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related