Skip to content

Commit 5b09c78

Browse files
committed
Integrate Forms in Django
1 parent c833ba2 commit 5b09c78

File tree

1 file changed

+142
-0
lines changed

1 file changed

+142
-0
lines changed
Lines changed: 142 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,142 @@
1+
---
2+
title : Integrate Forms in Django
3+
sidebar_label : Integrate Forms
4+
---
5+
6+
# Integrate Forms in Django
7+
8+
<SubHeading>Learn how to manage Forms in Django</SubHeading>
9+
10+
**Managing Forms in [Django](https://www.djangoproject.com/)** is an essential part of building web applications.
11+
Let's dive deeper into managing forms in Django, providing more context and additional code examples for each approach.
12+
13+
![Forms in Django - Tutorial provided by AppSeed.](https://user-images.githubusercontent.com/51070104/268675023-54ea4ace-a8ad-442b-9b43-2ba12a6403ba.jpg)
14+
15+
16+
## **Django and Plain HTML**
17+
18+
When working with plain HTML forms in Django, you have complete control over the form markup. You manually create HTML forms in your templates and handle the form data in your views.
19+
20+
Here's a more detailed code example:
21+
22+
```html
23+
<!-- template.html -->
24+
<form method="post" action="{% url 'form_view' %}">
25+
{% csrf_token %}
26+
<label for="name">Name:</label>
27+
<input type="text" id="name" name="name" required>
28+
<label for="email">Email:</label>
29+
<input type="email" id="email" name="email" required>
30+
<button type="submit">Submit</button>
31+
</form>
32+
```
33+
34+
```python
35+
# views.py
36+
from django.shortcuts import render
37+
from django.http import HttpResponseRedirect
38+
39+
def form_view(request):
40+
if request.method == 'POST':
41+
name = request.POST.get('name')
42+
email = request.POST.get('email')
43+
# Process form data
44+
# Redirect or render a response
45+
else:
46+
# Render an empty form
47+
return render(request, 'template.html', {})
48+
```
49+
50+
51+
## **Django Native Forms**
52+
53+
Django provides a more organized way to handle forms using `forms.py` to define forms. These forms are easier to work with and can perform automatic validation.
54+
55+
Example Django form definition in `forms.py`:
56+
57+
```python
58+
# forms.py
59+
from django import forms
60+
61+
class MyForm(forms.Form):
62+
name = forms.CharField()
63+
email = forms.EmailField()
64+
```
65+
66+
Example Django view using the form:
67+
68+
```python
69+
# views.py
70+
from django.shortcuts import render
71+
from django.http import HttpResponseRedirect
72+
from .forms import MyForm
73+
74+
def form_view(request):
75+
if request.method == 'POST':
76+
form = MyForm(request.POST)
77+
if form.is_valid():
78+
name = form.cleaned_data['name']
79+
email = form.cleaned_data['email']
80+
# Process form data
81+
# Redirect or render a response
82+
else:
83+
form = MyForm()
84+
return render(request, 'template.html', {'form': form})
85+
```
86+
87+
In this example, we've defined a `MyForm` class in `forms.py`, which represents the form. The form is instantiated in the view, and its data is validated and processed if the request is a POST.
88+
89+
90+
## **Django Crispy Forms**
91+
92+
Django Crispy Forms is a popular third-party package that simplifies rendering forms with Bootstrap styles. It doesn't change the way you define forms but makes form rendering more elegant.
93+
94+
To use Crispy Forms, you'll need to install the package and add `'crispy_forms'` to your `INSTALLED_APPS` in `settings.py`. You can then use `{% load crispy_forms_tags %}` in your templates to apply Bootstrap styling to your forms.
95+
96+
```html
97+
<!-- template.html -->
98+
{% load crispy_forms_tags %}
99+
<form method="post" action="{% url 'form_view' %}">
100+
{% csrf_token %}
101+
{{ form|crispy }}
102+
<button type="submit">Submit</button>
103+
</form>
104+
```
105+
106+
Your form definition and view remain the same as in the native forms example.
107+
108+
109+
## **Django and HTMX**
110+
111+
HTMX is a library that enables dynamic web applications with minimal JavaScript. You can use Django with HTMX to create forms and views that update without full page reloads.
112+
113+
Here's an example of using HTMX in a template:
114+
115+
```html
116+
<!-- template.html -->
117+
<form method="post" action="{% url 'form_view' %}" hx-post="true" hx-target="#form-container">
118+
{% csrf_token %}
119+
<label for="name">Name:</label>
120+
<input type="text" id="name" name="name" required>
121+
<label for="email">Email:</label>
122+
<input type="email" id="email" name="email" required>
123+
<button type="submit" hx-trigger="click" hx-swap="outerHTML">Submit</button>
124+
</form>
125+
<div id="form-container"></div>
126+
```
127+
128+
To use HTMX, you should include the HTMX library in your project. In this example, the `hx-post` attribute is used to submit the form without a full page reload, and `hx-target` specifies where the response should be placed.
129+
130+
## ✅ In Summary
131+
132+
These examples should provide you with a more detailed understanding of the different approaches to managing forms in Django.
133+
Choose the one that best suits your project's needs and your level of expertise.
134+
135+
Django's native forms and Django Crispy Forms are often good starting points for beginners, while HTMX can add dynamic behavior with minimal JavaScript.
136+
137+
## ✅ Resources
138+
139+
- 👉 Access [AppSeed](https://appseed.us/) for more starters and support
140+
- 👉 [Deploy Projects on Aws, Azure and DO](https://www.docs.deploypro.dev/) via **DeployPRO**
141+
- 👉 Create landing pages with [Simpllo, an open-source site builder](https://www.simpllo.com/)
142+
- 👉 Build apps with [Django App Generator](https://app-generator.dev/django/) (free service)

0 commit comments

Comments
 (0)