Form Fields, Widgets & Layouts
Form fields define what data to collect. Widgets define how fields are rendered in HTML. Customizing widgets lets you add CSS classes, placeholders, and custom HTML attributes for professional-looking forms.
15 min•By Priygop Team•Updated 2026
Common Form Fields
- CharField — Text input
- EmailField — Email with validation
- IntegerField — Number input
- DecimalField — Decimal number
- BooleanField — Checkbox
- ChoiceField — Select dropdown
- DateField — Date picker
- FileField / ImageField — File upload
- URLField — URL with validation
- MultipleChoiceField — Multi-select
Widgets & Customization
Widgets & Customization
# blog/forms.py
# class RegistrationForm(forms.Form):
# username = forms.CharField(
# min_length=3, max_length=30,
# widget=forms.TextInput(attrs={
# 'class': 'form-control',
# 'placeholder': 'Choose a username',
# 'autofocus': True,
# })
# )
# email = forms.EmailField(
# widget=forms.EmailInput(attrs={'class': 'form-control'})
# )
# password = forms.CharField(
# widget=forms.PasswordInput(attrs={
# 'class': 'form-control',
# 'placeholder': 'Min 8 characters'
# })
# )
# role = forms.ChoiceField(choices=[
# ('reader', 'Reader'),
# ('author', 'Author'),
# ('editor', 'Editor'),
# ], widget=forms.Select(attrs={'class': 'form-control'}))
#
# birth_date = forms.DateField(
# widget=forms.DateInput(attrs={
# 'type': 'date', 'class': 'form-control'
# })
# )
# agree_terms = forms.BooleanField(
# required=True,
# label='I agree to the terms and conditions'
# )Tip
Tip
Use mixins to compose view behavior: LoginRequiredMixin + ListView creates an authenticated list view.
Diagram
Loading diagram…
QuerySets are LAZY — no DB hit until evaluated.
Common Mistake
Warning
Not specifying LoginRequiredMixin as the FIRST parent class. Mixins are processed left to right — auth must come first.
Practice Task
Note
(1) Add LoginRequiredMixin to a view. (2) Add UserPassesTestMixin for role checks. (3) Test with logged-out users.
Quick Quiz
Key Takeaways
- Form fields define what data to collect.
- CharField — Text input
- EmailField — Email with validation
- IntegerField — Number input