CODEWITHSUNDEEP
pythondjangodjango-formsdjango-select2
fuser60596
fuser60596

Reputation: 1097

ModelForm and ModelSelect2Widget (django-select2)

I have a ModelForm which includes a ModelSelect2Widget from django-select2

https://github.com/applegrew/django-select2

Following the Documentation from here:

https://django-select2.readthedocs.io/en/latest/django_select2.html#django_select2.forms.ModelSelect2Widget

forms.py

class RentalForm(forms.ModelForm):


    name = forms.ChoiceField(
            widget=ModelSelect2Widget(
                model=ldap_data,
                search_fields=['user__icontains']
            )
        )
    date_start = forms.CharField(label="Datum Ausleihe", help_text="", widget=forms.TextInput(attrs={'class': 'form-control form-control-sm', 'placeholder': '01.01.2019' }))
    date_end = forms.CharField(label="Datum Rückgabe", help_text="", widget=forms.TextInput(attrs={'class': 'form-control form-control-sm', 'placeholder': '01.01.2019' }))

    class Meta:
        model = Rental
        fields = ['device', 'name', 'date_start', 'date_end',]

models.py

class ldap_data(models.Model):
    user = models.CharField(max_length=1024)

    def __str__(self):
        return self.user

ldap_data contains around 100 entries.

In my opinion everything looks fine, but in the rendered template no data is available in the name dropdown.

Console Log in Google Chrome shows:

select2.min.js:1 Uncaught ReferenceError: jQuery is not defined
    at select2.min.js:1
    at select2.min.js:1
(anonymous) @ select2.min.js:1
(anonymous) @ select2.min.js:1
django_select2.js:9 Uncaught ReferenceError: jQuery is not defined
    at django_select2.js:9
    at django_select2.js:11

Upvotes: 3

Views: 5609

Answers (3)

ccstacyline
ccstacyline

Reputation: 1

Well, it happens to me too recently... And turns out that the jquery script

(<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>)

should be placed first before any scripts that use jquery (it will use jquery, but the jquery hasn't been called).

Upvotes: -1

fuser60596
fuser60596

Reputation: 1097

Found the solution:

{{ form.media.js }}

needs to be after the import of jquery.

Upvotes: 4

ritlew
ritlew

Reputation: 1682

Did you follow all the steps in the getting started section?

  1. Add django_select2 to your INSTALLED_APPS in your project settings.

  2. Add django_select to your urlconf if you use any ModelWidgets:

    url(r'^select2/', include('django_select2.urls')),

  3. Add the CSS to the head of your Django template:

    {{ form.media.css }}

  4. Add the JavaScript to the end of the body of your Django template:

    {{ form.media.js }}

Also, there appears to be an external dependency not provided by the module itself:

External Dependencies

jQuery version 2 This is not included in the package since it is expected that in most scenarios this would already be available.

Upvotes: 5

Related Questions