django-crispy-forms & ModelChoiceFields / Select2 Integration for Searchable Form Fields

In this video, we look at the ModelChoiceField in Django Forms, that allows a form to link to Foreign Key objects in a select element.

We will see how to style the form with django-crispy-forms and Bootstrap 5, and also how to add a Select2 widget to the select element, allowing users to search through the list of Foreign Key objects.

After looking at foreign key relations, we'll also see how to add multiple related objects in a form to a model's ManyToManyField, using the ModelMultipleChoiceField in Django.

Finally, we will also see how to customize the QuerySet passed to the ModelChoiceField and ModelMultipleChoiceField - allowing the related items in the select element to be filtered.

? ????????:
00:00 Intro
02:11 Creating Django Form with a ModelChoiceField
08:00 Handling POST request in Django view
11:39 Styling form with django-crispy-forms
13:46 Adding select2 to ModelChoiceField for searchable dropdown
16:14 Limiting foreign-key queryset in ModelChoiceField
17:48 Adding multiple relations with ModelMultipleChoiceField
20:46 Database junction table for ManyToManyField

☕️ ??? ?? ? ??????:
To support the channel and encourage new videos, please consider buying me a coffee here:
https://ko-fi.com/bugbytes

▶️ Full Playlist:

?????? ?????:
? Blog: https://bugbytes.io/posts/
? Github: https://github.com/bugbytes-io/
? Twitter: https://twitter.com/bugbytesio

? ??????? ??????? ??? ???????????:
Github: https://github.com/bugbytes-io/django-modelchoicefield-demo
ModelChoiceField: https://docs.djangoproject.com/en/4.2/ref/forms/fields/#modelchoicefield
ModelMultipleChoiceField: https://docs.djangoproject.com/en/4.2/ref/forms/fields #modelmultiplechoicefield
Django-crispy-forms: https://django-crispy-forms.readthedocs.io/en/latest/
Crispy-bootstrap5: https://pypi.org/project/crispy-bootstrap5/
jQuery: https://releases.jquery.com/
Select2: https://select2.org/getting-started/installation#using-select2-from-a-cdn
UserCreationForm: https://docs.djangoproject.com/en/4.2/topics/auth/default #django.contrib.auth.forms.UserCreationForm

#python #django #webdevelopment