Question

您好我正在尝试使用AJAX从我的数据库中显示主题名称。那是我现在的输出：

[{"pk": 1, "model": "school.subjects", "fields": {"name": "Math 140"}},
{"pk": 2, "model": "school.subjects", "fields": {"name": "English 102"}},
{"pk": 3, "model": "school.subjects", "fields": {"name": "CS210"}}]

但我只想展示：我该怎么做？

Math 140
English 102
CS210

这就是我的观点：

@csrf_exempt
def subjects_list(request):
    if request.is_ajax():
        user = request.user
        subjects = Subjects.objects.filter(user__exact = user)
        result = serializers.serialize("json", subjects, fields=('name'))
    else:
        result = "blablabl"
    return HttpResponse(result)

那就是我的test.html

{% extends "base.html" %}
{% block main-menu %}
    <div id="result"></div>
    <script type="text/javascript">
        $(function() {
            $.get("/subjects-list", function(data){
                $("#result").append(data);
            });
        }); 
    </script>
{% endblock %}

Answer 1

不要直接序列化您的模型，因为用户会看到合理的内部字段，所以不安全。

您想要使用真实的API引擎，例如django-tastypie或django-piston。使用这种引擎，您将能够选择要显示的字段，管理授权，输出格式等...

例如，使用tastypie：

class SubjectResource(ModelResource):
    class Meta:
        queryset = Subject.objects.all()
        resource_name = 'subjects'
        fields = ['name']

将产生：

{
  "objects": [
    {"name": "Math 140"},
    {"name": "English 102"},
    {"name": "CS210"},
  ]
}

当然，您可以使用以下实例方法删除objects包装器：

def alter_list_data_to_serialize(self, request, data):
    data[self.Meta.resource_name] = data['objects']
    del data['objects']
    del data['meta']
    return data

这是最干净的方式。

Answer 2

这是因为从服务器返回的数据是JSON。这需要在加载到DOM之前进行解析。你可以这样做：

复制，然后添加到 test.html ...

{% extends "base.html" %}
{% block main-menu %}
    <div id="result"></div>
    <script type="text/javascript">
        $(function() {
            $.get("/subjects-list", function(data){
                var $results = $("#result");
                for (var i = 0; i < data.length; i++) {
                    $results.append(data[i]["fields"]["name"] + "<br/>");
                }
            }, "json");
        }); 
    </script>
{% endblock %}

尽管如此，您可能希望研究使用javascript模板库。那里有很多。一般的想法是库可以处理将AJAX响应转换为HTML。

有一些stackoverflow问题回答了在这里使用的问题：

Recommended JavaScript HTML template library for JQuery?

What is the preferred template library for jQuery?

为了找到更多相关信息，您需要搜索“javascript templating”。

如何使用Ajax将输出数据与Django模板中的django模型分开

2 个答案: