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;
}

login.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}}
<input type="submit" value = "登錄" />
</form>

</body>
</html>

register.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>

效果展示

數據庫中查找數據



就這樣 關於form表單數據的登錄以及註冊就簡單完成了