Django将JSON数据传递给静态getJSON / Javascript [英] Django passing JSON data to static getJSON/Javascript
问题描述
我正在尝试从我的models.py中获取数据，并将其序列化为我的views.py中的JSON对象。
Models.py：
类平台（models.Model）：
platformtype = models.CharField（max_length = 25）
Views.py：
def startpage（request）：
return render_to_response main.html中'）;
def index（request）：
platforms_as_json = serializers.serialize（'json'，Platform.objects.all（））
return HttpResponse（platforms_as_json，content_type ='json'）
这样做之后，我想将这个对象传递到我的静态javascript文件中使用getJSON来填充我的模板的下拉列表（Main.html）。
JavaScript：
$。 getJSON（{{platforms_as_json}}，function（data）{
$ .each（data，function（index，item）{
$（'＃platformList'）。append $（'< option>< / option>'）。val（item）.html（item.platformtype）
）;
}）;
}）;
我已经看过SO中的许多其他线程，但都是针对使用嵌入式JS的用户他们的模板和/或不使用getJSON。截至目前，当我运行Django开发服务器时，数据没有显示在列表中。我究竟做错了什么？谢谢。
更新：
<！DOCTYPE html>
< html>
< head>
{％static static from staticfiles％}
< script type ='text / javascript'>
var platforms json =（{％autoescape off％} {{platforms_as_json}} {％endautoescape％}）;
< / script>
< / head>
< body>
< select id =platformList>< / select>
< ul id =root>< / ul>
< div id =root>< / div>
< script src ={％static'admin / js / platformddown_script.js'％}>< / script>
< / body>
< / html>
platformddown_script.js
$ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $选项>< / option>'）。val（item.platformtype）.html（item.platformtype）
）
}）;
此更新后仍然无效。
主要html render + json数据
import json
from django.shortcuts import render
def startpage（request）：
platforms = Platform.objects.select_related（）。values（'platformtype'）
return render（request，' Main.html'，{'platforms_as_json'：json.dumps（list（platforms）），}）
在模板中
{{platforms_as_json}}
html和js
< select id =platformList>< /选择>
< script>
$ .each（{％autoescape off％} {{platforms_as_json}} {％endautoescape％}，function（index，item）{
$（'＃platformList'）。append（
$（'< option>< / option>'）。val（item.platformtype）.html（item.platformtype）
）
}）;
< / script>
旧示例
https://gist.github.com/leotop/014a38bd97407a6380f2526f11d17977
I am trying to grab data from my models.py and serialize it into a JSON object within my views.py.
Models.py:
class Platform(models.Model):
platformtype = models.CharField(max_length=25)
Views.py:
def startpage(request):
return render_to_response('Main.html');
def index(request):
platforms_as_json = serializers.serialize('json', Platform.objects.all())
return HttpResponse(platforms_as_json, content_type='json')
After doing this I want to pass this object into my static javascript file which is using getJSON to populate my drop down list for my template(Main.html).
JavaScript:
$.getJSON("{{platforms_as_json}}", function (data) {
$.each(data, function (index, item) {
$('#platformList').append(
$('<option></option>').val(item).html(item.platformtype)
);
});
});
I have looked at many other threads within SO, but all of them are for those using embedded JS within their template and/or not using getJSON. As of right now, data is not being displayed in the list when I run my Django development server. What am I doing wrong? Thank you.
UPDATE:
<!DOCTYPE html>
<html>
<head>
{% load static from staticfiles %}
<script type = 'text/javascript' >
var platformsjson = "({% autoescape off %}{{platforms_as_json}}{% endautoescape %})";
</script>
</head>
<body>
<select id = "platformList"></select>
<ul id = "root"></ul>
<div id = "root"></div>
<script src = "{% static 'admin/js/platformddown_script.js' %}"></script>
</body>
</html>
platformddown_script.js:
$.each(platformsjson, function (index, item) {
$('#platformList').append(
$('<option></option>').val(item.platformtype).html(item.platformtype)
)
});
After this update it still doesn't work.
Main html render + json data
import json
from django.shortcuts import render
def startpage(request):
platforms = Platform.objects.select_related().values('platformtype')
return render(request, 'Main.html', {'platforms_as_json': json.dumps(list(platforms)),})
in template
{{ platforms_as_json }}
html and js
<select id="platformList"></select>
<script>
$.each({% autoescape off %}{{platforms_as_json}}{% endautoescape %}, function (index, item) {
$('#platformList').append(
$('<option></option>').val(item.platformtype).html(item.platformtype)
)
});
</script>
Old example https://gist.github.com/leotop/014a38bd97407a6380f2526f11d17977
这篇关于Django将JSON数据传递给静态getJSON / Javascript的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
