如何在 django 项目中使用 ajax 显示搜索结果？

Question

我在一个 Django 项目中工作，其中一个功能是用户可以搜索名称（使用表单），视图将在数据库中搜索该名称（经过一些转换），结果将显示在下面表格。

目前，每次提交搜索时都需要加载整个页面。我正在应用 ajax 来使这个动态化。问题是当我将搜索结果作为JsonResponse返回时，在ajax的success函数中看不到数据。

Views.py

def indexView (request):
    form = FriendForm ()
    friends = Friend.objects.all ()
    return render (request, "index.html", {"form": form, "friends": friends})


def searchFriend(request):
    if request.method =="POST":
        form = FriendForm (request.POST)

        if form.is_valid():
            if request.is_ajax():
                name = form.cleaned_data['name']
                query = Friend.objects.filer(first_name__contains=name)

                print(query)
                return JsonResponse(list(query), safe=False)

            else:
                return JsonResponse(form.errors)

Main.js

$(document).ready(function() {
    $("#form1").submit(function() { // catch the form's submit event
    var search = $("#searchField").val();
    

        $.ajax({ // create an AJAX call...
            data: $(this).serialize(), // get the form data
            method: 'post',
            dataType: 'json',
            url: "search/ajax/friend/",
            success: function(data) { // on success..
                console.log(data)
              
            }
        });
        return false;
    });
});

Answer 1

您的查询是否在终端打印？ Friend.objects.filer 使用 filter 而不是 filer 并使用type: 'post' 而不是method: 'post', 并添加data: $(search).serialize(), 而不是data: $(this).serialize(),