Django JQuery 自动完成显示没有搜索结果

Django JQuery autocomplete showing No search results

我直接上代码

models.py

class Restaurant(models.Model):
    name = models.CharField(max_length=100)
    owner = models.CharField(max_length=100)
    city = models.CharField(max_length=50)
    state = models.CharField(max_length=50)
    country = CountryField(choices=list(countries))
    contact = models.CharField(max_length=15)
    def __str__(self):
        return self.name

template.html

{% load staticfiles %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Dashboard</title>
    <script src="//code.jquery.com/jquery-1.10.2.js"></script>
    <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
    <script src="{% static 'registration/jquery.js' %}"></script>
</head>
<body>
    <input id="tags"/>
</body>
</html>

jquery.js

$(document).ready(function(){
 $( "#tags" ).autocomplete({
                        source: "{% url get_restaurant %}",
                        selectFirst: true,
                        minLength: 2
    });
});

urls.py

url(r'^get_restaurant/$', views.get_restaurant, name='get_restaurant')

views.py

def get_restaurant(request):
    term = request.GET.get('term')
    bslk = Restaurant.objects.filter(name__icontains=term)
    res = []
    for b in bslk:
        dict = {'id':b.id, 'label':b.name, 'value':b.name}
        res.append(dict)
    return HttpResponse(simplejson.dumps(res),'application/json')

我使用了以下导入:

import simplejson 对于 views.py

我在餐厅模型中有名称值,但问题是自动完成显示 No search results!

提前致谢!

jquery.js是一个静态文件,没有被django模板引擎预处理。所以你必须用硬编码 url:

替换 {% url %} 标签
$(document).ready(function(){
   $( "#tags" ).autocomplete({
                        source: "/get_restaurant/",
                        selectFirst: true,
                        minLength: 2
   });
});

或者以某种方式将此 url 从模板传递给 js。例如:

<script>
    var restaurantAutocompleteUrl = "{% url 'get_restaurant' %}";
</script>
<script src="{% static 'registration/jquery.js' %}"></script>

然后在JS文件中:

$(document).ready(function(){
   $( "#tags" ).autocomplete({
                        source: restaurantAutocompleteUrl,
                        selectFirst: true,
                        minLength: 2
   });
});

另一种选择是将 JS 绑定代码包装到函数中,并从模​​板中调用此函数:

<script src="{% static 'registration/jquery.js' %}"></script>
<script>
    bindAutocomplete("#tags", "{% url 'get_restaurant' %}");
</script>