Django select 2多选慢速加载_Django_Jquery Select2

Django select 2多选慢速加载

django

Django select 2多选慢速加载,django,jquery-select2,Django,Jquery Select2,我是个初学者，一直在使用select2.js的多选选项。在历史学校数据库中，我们有30多万学生id。我可以让select2选项工作，但它非常慢，而且需要很长时间才能加载。我见过其他带有select2的页面加载了大量数据，工作正常我使用下面的脚本加载select2 $(document).ready(function () { $('.js-example-basic-multiple').select2(); }); 在Django中，我正在使用以下内容加载模板中的数据： &

我是个初学者，一直在使用select2.js的多选选项。在历史学校数据库中，我们有30多万学生id。我可以让select2选项工作，但它非常慢，而且需要很长时间才能加载。我见过其他带有select2的页面加载了大量数据，工作正常

我使用下面的脚本加载select2

$(document).ready(function () {
    $('.js-example-basic-multiple').select2();
  });

在Django中，我正在使用以下内容加载模板中的数据：

  <script src= "{% static '/search/user_select2.js' %}" type="text/javascript"></script>

             <div class="col"><h4 style="margin-top: 0"><strong>Student ID List</strong></h4><select data-placeholder="Choose a list of 3-4 User ids..." class="js-example-basic-multiple"  value = "{{ userid }}" style="width: 1110px" required>
             {% for user in userid %}
             <option value="{{ user }}"> {{ user }}</option>
             {% endfor %}
           </select>

加载需要很长时间，因为您预加载了select2输入的所有选项。我建议您使用select2至以避免此问题。它将为您提供设置自动完成系统和加载匹配选项的工具，同时在select2输入上键入文本。此外，对结果进行分页，以便在滚动select2下拉列表时加载结果

基本上，您将拥有一个自动完成视图：

from dal import autocomplete

from your_app.models import Student


class Status1StudentsAutocomplete(autocomplete.Select2QuerySetView):
    def get_queryset(self):
        qs = Student.objects.filter(student_status_id=1)
        if self.q:  # self.q is the user-typed query
            qs = qs.filter(name__istartswith=self.q)
        return qs

当然，这需要路由：

from your_app.views import Status1StudentsAutocomplete

urlpatterns = [
    url(
        r'^autocomplete/students/status-1/$',
        Status1StudentsAutocomplete.as_view(),
        name='students_status1_autocomplete',
    ),
]

然后为您的字段使用自动完成小部件：

from dal import autocomplete

from django import forms


class SomeForm(forms.Form):
    student = forms.ModelChoiceField(
        queryset=Student.objects.filter(student_status_id=1),
        widget=autocomplete.ModelSelect2(url='student_status1_autocomplete')
    )

最后，只需像往常一样显示表单，不要忘记在{{form.media}中包含自定义css/js

我将如何使用django autocomplete light来提高性能？抱歉，我更新了答案，以提供更多关于django autocomplete light将如何帮助您的详细信息。谢谢Antoine。不幸的是，django autocomplete light似乎已关闭。重试Retrytotal=2，connect=None，read=None，redirect=None在连接被“ConnectTimeoutError”中断后，到files.pythonhosted.org的连接超时。连接超时=15’：/packages/ee/2c/8830276bfdb01713486585640125e0b6d0f2b4ee2ece96689a846c3d77cc/django-autocomplete-light-3.2.10.tar.gz pythonhosted.org可能存在临时问题。

from dal import autocomplete

from django import forms


class SomeForm(forms.Form):
    student = forms.ModelChoiceField(
        queryset=Student.objects.filter(student_status_id=1),
        widget=autocomplete.ModelSelect2(url='student_status1_autocomplete')
    )

{% extend "your_layout.html" %}
{% block extrahead %} {# assuming extrahead block is within the <head> element #}
    {{ block.super }}
    {{ form.media }}
{% endblock %}

{% block content %} {# assuming you have a content block within your <body> element #}
    <form method="POST">
        {% csrf_token %}
        {{ form }}
        <button type="submit">Go!</button>
    </form>
{% endblock %}