Django Select 2 Widget не работает, поле отображается, но стили не применяются

Я уже некоторое время пытаюсь использовать множественный выбор с помощью виджета django-select2

Шаг-1: Я установил django-select2 с помощью pip install django-select2

Шаг-2: Добавьте его в установленное приложение

INSTALLED_APPS = [
...
django_select2
...
]

Шаг-3: Я добавил следующее в settings.py

SELECT2_JS = "https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.12/js/select2.min.js"
SELECT2_CSS = "https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.12/css/select2.min.css"
SELECT2_I18N_PATH = "https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.12/js/i18n"

Шаг 4: Я попробовал использовать виджеты

from django_select2.forms import Select2MultipleWidget
class ClientForm(AppModelForm):

    class Meta:
        model = Client
        fields = "__all__"
        exclude = ['client_website']
        widgets = {
            'point_of_contact': Select2MultipleWidget
        }

Шаг 5: Просто отрисуйте форму без какого-либо цикла

{{ client_form }}

Результатом является

enter image description here

К селекту не применяется стиль.

Я также попробовал включить стили и скрипты в тег head (Не помогло).

Я считаю, что виджет работает, потому что когда я переключаюсь с Select2MultipleWidget на Select2Widget, он меняется на один select

<select name="point_of_contact" lang="None" data-minimum-input-length="0" data-theme="default" data-allow-clear="true" data-placeholder="" id="id_point_of_contact" class="django-select2" multiple="">
  <option value="2">Test</option>

  <option value="1">Tester</option>

</select>

Выше приведен html-файл для виджета multi select от django

Прошу помощи в получении функциональности django-select2

По умолчанию SELECT2_JS и SELECT2_CSS указывают на соответствующую CDN Cloudflare. Используйте его, когда вы хотите загрузить определенную версию из CDN или когда вы хотите загрузить из локального хранилища.

Обязательно добавьте шаблоны select2 url в основной urls.py:

urlpatterns = [
    path("select2/", include("django_select2.urls")),
    # other patterns
]

и добавить активы формы в файл шаблона:

<!-- To render stylesheet link tags of select2 -->
{{ client_form.media.css }}

<form method="POST">
    {% csrf_token %}
    {{ client_form }}
    <input type="submit">
</form>

<!-- Add JQuery script -->
<!-- To render script tags of select2 -->
{{ client_form.media.js }}

Руководства по установке и быстрому запуску доступны здесь:
https://django-select2.readthedocs.io/en/latest/#installation
https://django-select2.readthedocs.io/en/latest/#quick-start

Активы формы Django: https://docs.djangoproject.com/en/3.2/topics/forms/media/

Вернуться на верх