DEV Community

loading...
Cover image for Registration Page using UserCreationForm (Django) - Part 2

Registration Page using UserCreationForm (Django) - Part 2

balt1794
Engineer
・3 min read

In the last post, we created a registration form using the UserCreationForm provided by Django authentication system and tested the form by creating some users.

For this post, let’s customize the registration form to add an extra field for emails.

In part 1 of the series, we also created a forms.py file in the users app folder.

If you did not create this file, please create a forms.py file in the users app folder now.

The users folder tree should look like the one below.

Screen Shot 2021-05-01 at 10.36.17 AM

Forms.py

Open forms.py and add the following code


#path -> users/forms.py

from django.contrib.auth.forms import UserCreationForm
from django import forms
from django.contrib.auth.models import User


class CustomUserForm(UserCreationForm):
    class Meta:
        model = User
        fields = ['username', 'email', 'password1', 'password2']

#baltlogs.com

Enter fullscreen mode Exit fullscreen mode

— Imported UserCreationForm and User model which is provided by Django authentication system.

— Imported Django forms.

— Created a custom form called CustomUserForm using the User model. The custom form has similar fields as the default form provided by Django. Only difference is the email field has been included in the custom form.

Feel free to add more fields such as first name, last name, etc.

Edit views.py to render the new custom form.

Views.py


#path -> users/views.py

from django.shortcuts import render, redirect
from django.contrib.auth.forms import UserCreationForm
from .forms import CustomUserForm

def login_page(request):

    return render(request, 'users/login.html')

def register_page(request):
    if request.method != 'POST':
        form = CustomUserForm()
    else:
        form = CustomUserForm(request.POST)
        if form.is_valid():
            form.save()
            return redirect('users:login')

    context = {'form': form}

    return render(request, 'users/register.html', context)

#batlogs.com

Enter fullscreen mode Exit fullscreen mode

— Imported the new form (CustomUserForm) from forms.py.

— Replaced UserCreationForm with CustomUserForm to render the new form.

Learn more about User model and UserCreationForm provided Django authentication system below.

Django Authentication System

If you were to render the form again, you should see the email field appear in the form. However, before rendering the form, open register.html

Register.html


<!-- path -> users/templates/users/register.html -->

<form method="POST" action="">
    {% csrf_token %}
    <h3>REGISTER</h3>
    <h5>{{form.username.label}}</h5>
    {{form.username}}
    <h5>{{form.email.label}}</h5>
    {{form.email}}
    <h5>{{form.password1.label}}</h5>
    {{form.password1}}
    <h5>{{form.password2.label}}</h5>
    {{form.password2}}
    <input type="submit" name="Create User">
</form>

<!-- baltlogs.com -->

Enter fullscreen mode Exit fullscreen mode

— Displayed the form fields individually in order to get rid of the password requisites shown on the screen for the register form.

Save the template and run server.

Screen Shot 2021-05-01 at 11.20.02 AM

Create some users to test that the email field is working. Go to the admin panel and make sure that the emails for newly created users appear in the admin panel.

Screen Shot 2021-05-01 at 11.40.51 AM

Next up, we will style the register form.

Part 3 coming soon…

Learn more about Django:

Twitter

Registration Page using UserCreationForm (Django) – Part 1

Method str Explained using Django Admin Panel

Django 3..2..1..Takeoff Book

Personal Website

Discussion (0)

Forem Open with the Forem app