在Django中将MySQL查询结果传递给Javascript/Jquery

Question

我正在尝试把MySQL查询的结果放到我的Django模板中，然后传给一个JavaScript变量。我使用的是pivot.js，这个库需要用到jQuery和jQuery UI。

在Django的视图中：

cursor.execute(query)
data = dictfetchall(cursor)
json_data = json.dumps(data, cls=DateTimeEncoder)
context['pivot_data'] = json_data

这样做是有效的，我可以在JavaScript控制台看到数据，但不知道为什么格式不太对。

在我的Django模板中：

{% load staticfiles %}
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script>
<script type='text/javascript' src="{% static "js/pivot.js" %}"></script>
<script type='text/javascript'>
    var pivotData = '{{ pivot_data }}';
    $("#output").pivotUI(
        pivotData,
        {
            rows: ["XXX"],
            cols: ["YYY"]
        }
        );
</script>

Answer 1

接下来要讲的是一个字符串（它是你引用的一个JSON对象）：

var pivotData = '{{ pivot_data }}';

你可以这样做：

var pivotData = {{ pivot_data }};

但是这样做是不好的习惯，因为这就像是在执行JSON数据（eval），而且在处理某些特殊字符时会出错，具体可以参考这里的说明。

更好的做法是：

var pivotData = JSON.parse('{{ pivot_data }}');