Membuat form django dengan Widget Tweaks

Widget Tweaks dan Form Crispy adalah dua pustaka Django yang menyediakan fungsionalitas tambahan untuk mempermudah dan mempercepat proses pengembangan formulir HTML.

Widget Tweaks menyediakan fitur untuk mengubah tampilan elemen form HTML seperti menambahkan kelas CSS, menambahkan placeholder, menambahkan atribut HTML, dan lain-lain secara dinamis di sisi server menggunakan tag-template Django.

Widget Tweaks cukup mudah digunakan dan dapat menambahkan fungsionalitas tambahan ke formulir Django tanpa perlu menambahkan file CSS atau JavaScript.

Form Crispy adalah pustaka Django yang memudahkan pembuatan formulir yang responsif dan terstruktur dengan menggunakan layout yang telah ditentukan sebelumnya. Form Crispy memudahkan pengembangan formulir dengan menambahkan gaya dan perilaku yang seragam pada setiap elemen form, dan memungkinkan penyesuaian mudah dari tata letak elemen form.

Kelebihan Widget Tweaks dan Form Crispy adalah mereka dapat mempercepat proses pengembangan formulir HTML dan memudahkan penyesuaian tampilan formulir, memungkinkan Anda untuk fokus pada logika bisnis daripada memikirkan tentang tampilan form HTML.

Selain itu, penggunaan Widget Tweaks dan Form Crispy juga dapat meningkatkan pengalaman pengguna dengan formulir yang lebih responsif dan mudah digunakan, untuk memakainya, kita harus install terlebih dulu

pip install django-widget-tweaks

Setelah itu kita kenalkan di settings.py di INSTALLED_APPS = ['widget_tweaks']

setelah itu kita buat dulu models.py yang akan menyimpan isian form dari user ke dalam database

class Pendaftaran(models.Model):
nama = models.CharField(max_length=200)
no_hp = models.CharField(max_length=200)
email = models.EmailField(max_length=200)
negara = models.CharField(max_length=200)

class Meta:
verbose_name_plural = 'Pendaftaran'

def __str__(self):
return self.nama

Yang selanjutnya kita buat file forms.py

from django.template import Template
from django.template.context import Context
from widget_tweaks.templatetags import widget_tweaks

class PendaftaranForm(forms.Form):
nama = forms.CharField(max_length=200)
no_hp = forms.CharField(max_length=200)
email = forms.EmailField(max_length=200)
negara = forms.CharField(max_length=200)


Kita buat juga views.py nya

def daftar(request):
form = PendaftaranForm()
if request.method == 'POST':
form = PendaftaranForm(request.POST)
if form.is_valid():
nama = form.cleaned_data['nama']
no_hp = form.cleaned_data['no_hp']
email = form.cleaned_data['email']
negara = form.cleaned_data['negara']
Pendaftaran.objects.create(nama=nama, no_hp=no_hp, email=email, negara=negara)
return render(request, 'thank_you.html')
else:
form = PendaftaranForm()
return render(request, 'daftar.html', {'form': form})

Membuat sebuah fungsi view yang akan menangani request POST dari form PendaftaranForm. Dalam fungsi ini, kita perlu melakukan validasi form dan menyimpan data ke database jika form valid,
yang setelahnya kita buat file daftar.html

<form method="post">
{% csrf_token %}
{% load widget_tweaks %}
{% for field in form %}
<div class="form-group">
<label class="control-label">{{ field.label }}</label>
{% render_field field class+="form-control" %}
{% for error in field.errors %}
<p class="help-block">{{ error }}</p>
{% endfor %}
</div>
{% endfor %}
<button type="submit" class="btn btn-primary">Daftar</button>
</form>

sedangkan file thank_you.html bisa dibuat custom ses suka hati, terakhir, di urls.py kita buat seperti ini

urlpatterns = [
............
path('daftar/', views.daftar, name='daftar'),
............
]