我终于按照此处找到的说明进行了自动完成搜索
https://github.com/xcash/bootstrap-autocomplete
https://bootstrap-autocomplete.readthedocs.io/en/latest/
它非常易于使用,不需要安装任何应用程序,
settings.py并且对bootstrap 3和bootstrap 4都适用。
还有许多其他软件包可用,但这对我来说很简单。
我将解释我使用的代码
page.html
{% block script %} <script src="https://cdn.rawgit.com/xcash/bootstrap-autocomplete/3de7ad37/dist/latest/bootstrap-autocomplete.js"></script> <script> $('.basicAutoComplete').autoComplete( {minLength: 1} ); $('.dropdown-menu').css({'top': 'auto', 'left': 'auto'}) </script>{% endblock %}.....{% if field.name == "from_email" %} {% render_field field %}{% else %} {% render_field field %}{% endif %}autoComplete是执行该操作所调用的函数,并
minLength在执行提取操作之前指定了文本的最小长度。我添加了额外的CSS来修复自动完成下拉菜单,否则很奇怪。
Jinja渲染器不断从视图覆盖类定义,因此我添加了if检查。
urls.py
from . import viewsurlpatterns = [ . . . path('email_autocomplete/', views.email_autocomplete, name='email_autocomplete')]将此行添加到
urls.py
表格
class LeaveForm(forms.Form): from_email = forms.EmailField(required=True, widget=forms.TextInput( attrs={ 'style': 'width: 400px', 'class': 'basicAutoComplete', 'data-url': "/domain/email_autocomplete/" }))上面是中输入字段的代码
forms.py。data-url指向将在其中生成JSON结果的位置。
views.py
from django.http import HttpResponse, HttpResponseRedirect, JsonResponsefrom .models import modeldef email_autocomplete(request): if request.GET.get('q'): q = request.GET['q'] data = model.objects.using('legacy').filter(email__startswith=q).values_list('email',flat=True) json = list(data) return JsonResponse(json, safe=False) else: HttpResponse("No cookies")这对我来说是最令人困惑的部分。GET请求很容易理解,但是花了一些时间才能将数据
model.objects转换为JSON格式的对象。诀窍是使用
values_list('columnName',flat=True)从数据库中过滤数据时,然后使用转换为列表
list(data),最后使用
JsonResponse将其转换为JSON。
希望这对想要简单自动完成的任何人有帮助



