Question

我在线浏览了一些资源，以利用jquery autocomplete填充搜索框。

但是，当我键入search box时，而不是返回搜索结果，而是返回了No Results。另一个问题是，此No Results不会显示为正常下拉至search box以下。相反，它显示为search box下面的文本。

有什么想法吗？

add_new_schedule.html

<!-- jquery, jqueryui, bootstrap4 cdn are used in the headers -->

<input class="form-control" id="id_test" name="test">    <!-- this is the search box -->

jquery

$(document).ready(function () {
    $('#id_test').autocomplete({
        source: "",
        minLength: 1,
        autoFocus: true,
    });
});

views.py

import json

...
...

def add_new_schedule(request):
    if request.user.is_authenticated:

        if request.GET and request.is_ajax():
            q = request.GET.get('term')
            print(q)
            student_object = Student.objects.filter(first_name__startswith=q)
            results = []
            for r in student_object:
                results.append(r.first_name)
            data = json.dumps(results)
            print(results)
        else:
            data = 'fail'
        mimetype = 'application/json'
        return render(request, 'static/html/add_new_schedule.html')

在此阶段，当我键入search box时，print(results)将打印出Student数据库中可能匹配的列表。但是，此结果不会反馈到search box ...

urls.py

path('schedule/add-new-schedule/', views.add_new_schedule, name='add_new_schedule')

Answer 1

就目前而言，您只会从视图中返回HTML。您需要做的是有一种返回已创建的JSON data的方法。

您似乎已经在分支该请求是否为AJAX了。因此，您需要做的就是在该分支的末尾返回一些JSON：

def add_new_schedule(request):
    if request.user.is_authenticated:

        if request.GET and request.is_ajax():
            q = request.GET.get('term')
            print(q)
            student_object = Student.objects.filter(first_name__startswith=q)
            results = []
            for r in student_object:
                results.append(r.first_name)
            return JsonResponse(results, safe=False)

        else:
            return render(request, 'static/html/add_new_schedule.html')

JsonResponse自动设置模仿类型并编码为JSON。 safe=False允许您传递列表而不是字典。根据Django文档，传递列表（已变成Javascript数组）最初被认为是不安全的，但是Javascript在2011年解决了该问题，因此现在不必担心。

从技术上讲，您不需要最后一个else，您可以简化return render...。这确实是一种风格选择。

就错误消息在网页上的位置而言，您是否可能没有包含某些必需的CSS或碰巧拥有自己的具有相同类名的CSS？

django jquery自动完成搜索框未显示结果

1 个答案: