Creating forms in Django is just like creating a model. Remember, in our previous sections we discussed creating a Django model where we inherited from the Django class and its attributes to use as form fields. Similarly, we’ll have to do in form processing. Let’s start by adding a python file in our app as myform.py that will contain forms for our app. The code shown below will be used for the file myform.py:
from django import forms
class MyForm (forms.Form):
user_name = forms.CharField(max_length = 40)
password = forms.CharField(widget = forms.PasswordInput())
As you can see for the password, we used the “widget” argument that will hide the password on the web page. Now after creating forms, what we do is send the data to the server with the help of two methods either the GET method or POST. In Django, we have to use the ‘method’ argument to provide the type of request we are going to set for the form data. Here, we are going to use the POST method that can be accessed via request.POST dictionary in Django.
Now, we are going to create a login view for our app under firstapp/views.py:
from firstapp.forms import MyForm
def login(request)
user_name = “Login First!!”
if request.method == “POST”:
MyFirstForm = MyForm(request.POST)
if MyFirstForm.is_valid():
user_name = MyFirstForm.cleaned_data[‘user_name’]
else:
MyFirstForm = MyForm()
return render (request, ‘logged.html’, {“username”: user_name})
Let’s understand what else we need. So, we need an HTML form login template where the user will enter the credentials and another HTML page that will appear after logging into the account successfully.
So, we are going to create a Login template first as follows:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>HTML LOGIN FORM TEMPLATE</title>
</head>
<body>
<form name = "form" action = "{% url "firstapp.views.login" %}"
method = "POST" >{% csrf_token %}
<div style = "max-width:350px;">
<center>
<input type = "text" style = "margin-left:18%;"
placeholder = "Identifiant" name = "uname" />
</center>
</div>
<br>
<div style = "max-width:350px;">
<center>
<input type = "password" style = "margin-left:18%;"
placeholder = "password" name = "password" />
</center>
</div>
<br>
<div style = "max-width:30px;">
<center>
<button style = "border:0px; margin-top:8%;
height:50px; width:80%;margin-left:20%;" type = "submit"
value = "Login" >
<strong>Login</strong>
</button>
</center>
</div>
</form>
</body>
</html>
Now this page will ask the user to enter details like username and password. We’ll name the file above with index.html
And we are going to create another HTML template with the name logged.html
<html>
<body>
<h2>Hi <strong>{{uname}}</strong>, Welcome!! </h2>
</body>
</html>
Lastly, we need to pair the URLs in our firstapp/urls.py file:
from django.conf.urls import patterns, url
from django.views.generic import TemplateView
url_patterns = patterns(‘firstapp.views’,
url(r’^connection/’, TemplateView.as_view(template_name = ‘index.html’)),
url(r’^login/’, ‘login’, name = ‘login’))
So, when we access “/firstapp/connection” the first template (index.html) will be rendered on the browser asking for user details and after submitting all the details, it will render the second page. In case, you entered the wrong details, it will show you the same page with the message “Login First!!”.