django form表单登录注册案例

1-登录注册实现思路

1-创建模型类-------从而映射生成数据表
2-创建登录模板以及注册模板
3-创建视图函数
4-配置路由
总之就是先将架构打好  然后一步一步实现功能

1-登录注册第一步–创建模型生成数据表

1-在注册的APP下面的models.py里面创建模型

from django.db import models

# Create your models here.

class UserLogin(models.Model):
    username = models.CharField(max_length=20)
    password = models.CharField(max_length=20)
    email = models.EmailField()

2-执行映射文件生成数据表
在这里插入图片描述

2-form表单的引用

登录页面和注册页面都会用到form表单来提交数据

当数据提交到后台后,需要在视图函数中去验证数据的合法性.

django中提供了一个form表单的功能,这个表单可以用来验证数据的合法性还可以用来生成HTML代码

今天的登录注册案例我们就来使用这个django自带的form来生成前端页面以及验证数据.

3-关于django form表单的使用

1. 创建一个forms.py的文件,放在指定的app当中,然后在里面写表单.
2. 表单是通过类实现的,继承自forms.Form,然后在里面定义要验证的字段.
3. 在表单中,创建字段跟模型是一模一样的,但是没有null=True或者blank=True等这几种参数了,有的参数是required=True/False.
4. 使用is_valid()方法可以验证用户提交的数据是否合法,而且HTML表单元素的name必须和django中的表单的name保持一致,否则匹配不到.
5. is_bound属性:用来表示form是否绑定了数据,如果绑定了,则返回True,否则返回False.
6. cleaned_data:这个是在is_valid()返回True的时候,保存用户提交上来的数据.

1-form表单例子

在对应的app下面创建forms.py文件在里面创建xxx类
可以生成前端页面,也可以用来验证数据的合法性.

1-注册form表单:创建forms.py的文件,创建注册的表单

from django import forms

#用户注册
class UserFormRegister(forms.Form):
     username = forms.CharField(label='用户名',max_length=100)
     password1 = forms.CharField(label='密码',widget=forms.PasswordInput())
     password2 = forms.CharField(label='确认密码',widget=forms.PasswordInput())
     email = forms.EmailField(label='电子邮件')

#用户登录
class UserFormLogin(forms.Form):
     username = forms.CharField(label='用户名',max_length=100)
     password = forms.CharField(label='密码',widget=forms.PasswordInput())

2-form表单中的一些参数说明

max_length  最大长度
min_length  最小长度
widget  负责渲染网页上HTML 表单的输入元素和提取提交的原始数据
attrs  包含渲染后的Widget 将要设置的HTML 属性
error_messages 报错信息
注:虽然form可以生成前端页面,但这个功能实际用的少,主要是是用form表单的验证功能.

3-视图函数

1-将UserFormRegister UserFormLogin类生成实例,传入模板渲染前端页面
2-将获取到的参数传入UserFormRegister UserFormLogin类,用is_valid()方法验证提交数据的合法性
用cleaned_data获取单个数据对象值

from django.shortcuts import render,render_to_response
from django import forms
from django.http import HttpResponse
from .models import UserLogin
from .forms import UserFormRegister,UserFormLogin
# Create your views here.

def login(request):
    if request.method == "POST":
        uf = UserFormLogin(request.POST)
        if uf.is_valid():
            #获取表单信息
            username = uf.cleaned_data['username']
            password = uf.cleaned_data['password']
            userResult = UserLogin.objects.filter(username=username,password=password)
            if (len(userResult)>0):
                return render_to_response('BG/success.html',{'operation':"登录"})
            else:
                return HttpResponse("该用户不存在")
    else:
        uf = UserFormLogin()
        return render_to_response("BG/login.html", {'uf':uf})

def register(request):

    if request.method == "POST":
        uf = UserFormRegister(request.POST)
        if uf.is_valid():
        #获取表单信息
            username = uf.cleaned_data['username']
            filterResult = UserLogin.objects.filter(username = username)
            if len(filterResult)>0:
                return render_to_response('BG/register.html', {"errors": "用户名已存在"})
            else:
                password1 = uf.cleaned_data['password1']
                password2 = uf.cleaned_data['password2']
                errors = []
                if (password2 != password1):
                    errors.append("两次输入的密码不一致!")
                    return render_to_response('BG/register.html', {'errors':errors})
                #将表单写入数据库
                user = UserLogin.objects.create(username=username,password=password1)
                user.save()
                #返回注册成功页面
                return render_to_response('BG/success.html',{'username':username,'operation':"注册"})
    else:
        uf = UserFormRegister()
    return render_to_response('BG/register.html', {'uf':uf})

urls.py中

from django.urls import path
from . import views

app_name = "BG"
urlpatterns = [
    path('login/',views.login,name='login'),
    path('register/',views.register,name='register'),

]

4-templates下创建app目录BG 在BG下分别创建login.html register.html以及success.html

在静态目录static下创建css目录在目录css下创建common.css

.body{
    color:blue;
    background: aqua;
    padding: 0 4em;
    margin: 0;
}
.h1{
    padding:2em 1em;
    background:ivory;
}
.h2{
   color:#bf8;
    border-top:1px dotted #fff;
    margin-top:2em ;
}
.p{
   margin:1em 0;
}

{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登录</title>
    <link rel="stylesheet" href="{% static 'css/common.css' %}">
</head>
<body>
<h1>登录页面：</h1>
<form method = 'post' enctype="multipart/form-data">
{{uf.as_p}}
<input type="submit" value = "登录" />
</form>

</body>
</html>

{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>注册</title>
    <link rel="stylesheet" href="{% static 'css/common.css' %}">
</head>
<body>
<h1>注册页面：</h1>
<form method = 'post' enctype="multipart/form-data">
{{uf.as_p}}
{{errors}}
</br>
<input type="submit" value = "注册" />
</form>
</body>
</html>

success.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>成功页面</title>

</head>
<body>
<form method = 'post'>
 <h1 style="color: aqua">恭喜,{{operation}}成功！</h1>

</form>

</body>
</html>