Django forms組件
阿新 • • 發佈：2018-11-22
brush tro 技術分享 _for pre b- 模板文件 字符串類型 exception 
校驗字段
模板文件
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<form action="" method="post">
<p>用戶名: <input type="text" name="name"></p>
{# <p>密碼: <input type="text" name="pwd"></p>#}
<p>確認密碼: <input type="text" name="re_pwd"></p>
<p>郵箱: <input type="text" name="email"></p>
<input type="submit" value="提交">
</form>
</body>
</html>
視圖文件
from django import forms
from django.forms import widgets
class MyForm(forms.Form):
# 定義一個屬性,可以用來校驗字符串類型
# 限制最大長度是8,最小長度是3
name = forms.CharField(max_length=8, min_length=3, label=‘用戶名‘,
error_messages={‘max_length‘: ‘最長是8‘, ‘min_length‘: ‘最短是3‘, ‘required‘: ‘這個必須填‘},)
pwd = forms.CharField(max_length=8, min_length=3, required=True, label=‘密碼‘,
error_messages={‘max_length‘: ‘最長是8‘, ‘min_length‘: ‘最短是3‘, ‘required‘: ‘這個必須填‘},)
re_pwd = forms.CharField(max_length=8, min_length=3, required=True, label=‘確認密碼‘,
error_messages={‘max_length‘: ‘最長是8‘, ‘min_length‘: ‘最短是3‘, ‘required‘: ‘這個必須填‘},)
# 校驗是否是郵箱格式
email = forms.EmailField(label=‘郵箱‘, error_messages={‘required‘: ‘這個必須填‘, ‘invalid‘: ‘不符合郵箱格式‘})
數據從前端傳過來,校驗 要校驗的字典,可以多參數,但是不能少 def index_form(request): # 生成對象時(實例化),需要傳入要校驗的數據(字典) if request.method==‘GET‘: return render(request,‘indxe.html‘) elif request.method==‘POST‘: print(request.POST) myform=MyForm(request.POST) # is_valid如果是true表示校驗成功,反之,校驗失敗 if myform.is_valid(): # 校驗通過的數據 print(myform.cleaned_data) return HttpResponse(‘校驗成功‘) else: print(myform.cleaned_data) # 錯誤信息,它是一個字典 print(myform.errors) print(myform.errors.as_data()) print(type(myform.errors)) from django.forms.utils import ErrorDict return HttpResponse(‘校驗失敗‘)
渲染模板
視圖文件
from django.forms import widgets
from django.forms import widgets
from django.core.exceptions import ValidationError
name = forms.CharField(widget=widgets.TextInput(attrs={‘class‘: ‘form-control‘}))
pwd = forms.CharField(widget=widgets.PasswordInput(attrs={‘class‘: ‘form-control‘}))
widgets 就是用來渲染的
class MyForm(forms.Form):
# 定義一個屬性,可以用來校驗字符串類型
# 限制最大長度是8,最小長度是3
name = forms.CharField(max_length=8, min_length=3, label=‘用戶名‘,
error_messages={‘max_length‘: ‘最長是8‘, ‘min_length‘: ‘最短是3‘, ‘required‘: ‘這個必須填‘},
widget=widgets.TextInput(attrs={‘class‘: ‘form-control‘}))
pwd = forms.CharField(max_length=8, min_length=3, required=True, label=‘密碼‘,
error_messages={‘max_length‘: ‘最長是8‘, ‘min_length‘: ‘最短是3‘, ‘required‘: ‘這個必須填‘},
widget=widgets.PasswordInput())
re_pwd = forms.CharField(max_length=8, min_length=3, required=True, label=‘確認密碼‘,
error_messages={‘max_length‘: ‘最長是8‘, ‘min_length‘: ‘最短是3‘, ‘required‘: ‘這個必須填‘},
widget=widgets.PasswordInput())
# 校驗是否是郵箱格式
email = forms.EmailField(label=‘郵箱‘, error_messages={‘required‘: ‘這個必須填‘, ‘invalid‘: ‘不符合郵箱格式‘})
渲染模板
def index_form(request):
# 生成對象時(實例化),需要傳入要校驗的數據(字典)
myform=MyForm()
if request.method==‘GET‘:
return render(request,‘indxe2.html‘,locals())
模板文件
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<hr>
<h1>第一種方式</h1>
<form action="" method="post" >
<p>用戶名: {{ myform.name }}</p>
<p>密碼: {{ myform.pwd }}</p>
<p>郵箱: {{ myform.email }}</p>
<input type="submit" value="提交">
</form>
<hr>
<h1>第二種方式(for循環form對象,建議用這種)</h1>
<form action="" method="post" >
{% for foo in myform %}
<p>{{ foo.label }}:{{ foo }}</p>
{% endfor %}
<input type="submit" value="提交">
</form>
<h1>第三種方式(不建議用)</h1>
<form action="" method="post" >
{# {{ myform.as_p }}#}
{{ myform.as_ul }}
<input type="submit" value="提交">
</form>
</body>
</html>
渲染錯誤信息
視圖文件
# 第一步:先要繼承Form
from django import forms
from django.forms import widgets
from django.core.exceptions import ValidationError
# 寫一個類
class MyForm(forms.Form):
# 定義一個屬性,可以用來校驗字符串類型
# 限制最大長度是8,最小長度是3
name = forms.CharField(max_length=8, min_length=3, label=‘用戶名‘,
error_messages={‘max_length‘: ‘最長是8‘, ‘min_length‘: ‘最短是3‘, ‘required‘: ‘這個必須填‘},
widget=widgets.TextInput(attrs={‘class‘: ‘form-control‘}))
pwd = forms.CharField(max_length=8, min_length=3, required=True, label=‘密碼‘,
error_messages={‘max_length‘: ‘最長是8‘, ‘min_length‘: ‘最短是3‘, ‘required‘: ‘這個必須填‘},
widget=widgets.PasswordInput())
re_pwd = forms.CharField(max_length=8, min_length=3, required=True, label=‘確認密碼‘,
error_messages={‘max_length‘: ‘最長是8‘, ‘min_length‘: ‘最短是3‘, ‘required‘: ‘這個必須填‘},
widget=widgets.PasswordInput())
# 校驗是否是郵箱格式
email = forms.EmailField(label=‘郵箱‘, error_messages={‘required‘: ‘這個必須填‘, ‘invalid‘: ‘不符合郵箱格式‘})
# aa = forms.CharField(label=‘選擇‘, error_messages={‘required‘: ‘這個必須填‘, ‘invalid‘: ‘不符合郵箱格式‘},widget=widgets.CheckboxInput())
def clean_name(self):
# self:當前form對象
name = self.cleaned_data.get(‘name‘)
if name.startswith(‘sb‘):
# 失敗,拋異常
raise ValidationError(‘不能以傻逼開頭‘)
# 正常,把name返回
return name
def clean(self):
pwd=self.cleaned_data.get(‘pwd‘)
re_pwd=self.cleaned_data.get(‘re_pwd‘)
if pwd==re_pwd:
return self.cleaned_data
else:
raise ValidationError(‘兩次密碼不一致‘)
# 渲染錯誤信息
from app01 import models
def index_form(request):
# 生成對象時(實例化),需要傳入要校驗的數據(字典)
if request.method == ‘GET‘:
myform = MyForm()
elif request.method == ‘POST‘:
myform = MyForm(request.POST)
if myform.is_valid():
print(myform.cleaned_data)
myform.cleaned_data.pop(‘re_pwd‘)
models.User.objects.create(**myform.cleaned_data)
return redirect(‘http://www.baidu.com‘)
else:
all_error = myform.errors.get(‘__all__‘)
if all_error:
all_error=all_error[0]
return render(request, ‘indxe3.html‘, locals())
模板文件
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="/static/bootstrap-3.3.7-dist/css/bootstrap.min.css">
<title>Title</title>
</head>
<body>
<h1>第二種方式(for循環form對象,建議用這種)</h1>
<form action="" method="post" novalidate>
{% for foo in myform %}
<p>{{ foo.label }}:{{ foo }} <span>{{ foo.errors.0 }}</span></p>
{% endfor %}
<input type="submit" value="提交"><span>{{ all_error }}</span>
</form>
</body>
</html>
errors存放著錯誤信息
局部鉤子
def clean_name(self):
# self:當前form對象
name = self.cleaned_data.get(‘name‘)
if name.startswith(‘sb‘):
# 失敗,拋異常
raise ValidationError(‘不能以傻逼開頭‘)
# 正常,把name返回
return name
clean_name 是拿上面定義的name 返回的信息也是放到 errors字典內 鍵是name 對應的值內
全局鉤子
def clean(self):
pwd=self.cleaned_data.get(‘pwd‘)
re_pwd=self.cleaned_data.get(‘re_pwd‘)
if pwd==re_pwd:
return self.cleaned_data
else:
raise ValidationError(‘兩次密碼不一致‘)
全局鉤子 錯誤的信息存放在 errors 字典內的 __all__ 鍵對應的值內
from django.shortcuts import render,HttpResponse import json from django.http import JsonResponse # Create your views here. from django import forms from django.forms import widgets from django.core.exceptions import ValidationError from app01 import models class myForm(forms.Form): name = forms.CharField(max_length=12, min_length=3, label=‘用戶名‘, error_messages={‘max_length‘: ‘最長是12‘, ‘min_length‘: ‘最短是3‘, ‘required‘: ‘必填‘}, widget=widgets.TextInput(attrs={‘class‘: ‘form-control‘,‘id‘:‘usr‘})) pwd = forms.CharField(max_length=16, min_length=3, label=‘密碼‘, error_messages={‘max_length‘: ‘最長16‘, ‘min_length‘: ‘最短是3‘, ‘required‘: ‘必填‘}, widget=widgets.PasswordInput(attrs={‘class‘: ‘form-control‘,‘id‘:‘pwd‘})) re_pwd = forms.CharField(max_length=16, min_length=3, label=‘再次輸入密碼‘, error_messages={‘max_length‘: ‘最長16‘, ‘min_length‘: ‘最短是3‘, ‘required‘: ‘必填‘}, widget=widgets.PasswordInput(attrs={‘class‘: ‘form-control‘,‘id‘:‘pwd2‘})) email = forms.EmailField(label=‘郵箱‘, error_messages={‘required‘: ‘必填‘, ‘invalid‘: ‘不符合郵箱格式‘}, widget=widgets.EmailInput(attrs={‘class‘: ‘form-control‘,‘id‘:‘email‘})) def clean_name(self): name=self.cleaned_data.get("name") # print(name) account=models.User.objects.filter(name=name).first() if account: raise ValidationError(‘該用戶名已存在‘) return name def clean(self): pwd = self.cleaned_data.get(‘pwd‘) # print(pwd) re_pwd = self.cleaned_data.get(‘re_pwd‘) if pwd == re_pwd: return self.cleaned_data else: raise ValidationError(‘兩次密碼不一致‘) def index(request): if request.method == ‘GET‘: myform = myForm() return render(request, ‘index.html‘, locals()) elif request.method == ‘POST‘: # print(request.POST) # print(request.body) ajax1=json.loads(request.body.decode(‘utf-8‘)) # print(ajax1) myform = myForm(ajax1) if myform.is_valid(): data = myform.cleaned_data data.pop(‘re_pwd‘) models.User.objects.create(**data) return HttpResponse(‘註冊成功‘) else: return JsonResponse(myform.errors) def index_usr(request): print(request.body) ajax2 = json.loads(request.body.decode(‘utf-8‘)) print(ajax2) myform = myForm(ajax2) if myform.is_valid(): return HttpResponse(json.dumps(‘可以使用的用戶名‘)) else: return JsonResponse(myform.errors)註冊功能頁面（手擼）views層
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <link rel="stylesheet" href="/static/bootstrap-3.3.7-dist/css/bootstrap.css"> <title>Title</title> </head> <body> <div class="container-fluid"> <div class="row"> <div class="col-md-6 col-md-offset-3" id="msg"> <form action="" method="post" novalidate> {% for foo in myform %} <p id="{{ foo.auto_id }}">{{ foo.label }}:{{ foo }}</p> {% endfor %} </form> <button type="submit" id="btn">註冊</button> <span id="error"></span> </div> </div> </div> </body> <script src="/static/jquery-3.3.1.js"></script> <script src="/static/bootstrap-3.3.7-dist/js/bootstrap.js"></script> <script> $(‘#btn‘).click(function () { var pos_data = { ‘name‘: $(‘#usr‘).val(), ‘pwd‘: $(‘#pwd‘).val(), ‘re_pwd‘: $(‘#pwd2‘).val(), ‘email‘: $(‘#email‘).val() }; var pos = JSON.stringify(pos_data); $.ajax({ url: ‘/index/‘, type: ‘post‘, data: pos, contentType: ‘application/json‘, dataType: ‘json‘, success: function (data) { for (let i in data) { var error_msg2 = $(‘<span class="pull-right" style="color: red" id="msg_error" >‘ + data[i] + ‘</span>‘); if (error_msg2) { $(‘#msg_error‘).remove() } $(‘#id_‘ + i + ‘‘).append(error_msg2); if (data[‘__all__‘]) { var error_msg = $(‘<span class="pull-right" style="color: red" id="er_pwd2">‘ + data[‘__all__‘] + ‘</span>‘); if ($(‘#er_pwd2‘)) { $(‘#msg_error‘).remove() $(‘#er_pwd2‘).remove() } $(‘#id_re_pwd‘).append(error_msg) } else { $(‘#er_pwd2‘).remove() } break; } alert(data) } }) }); $(‘#usr‘).on(‘blur‘, function () { var pos_data2 = { ‘name‘: $(‘#usr‘).val(), }; var pos2 = JSON.stringify(pos_data2); $.ajax({ url: ‘/index_usr/‘, type: ‘post‘, data: pos2, contentType: ‘application/json‘, dataType: ‘json‘, success: function (data) { console.log(data) li=‘name‘ if (li in data) { var error_msg2 = $(‘<span class="pull-right" style="color: red" id="msg_error" >‘ + data[‘name‘] + ‘</span>‘); if (error_msg2) { $(‘#msg_error‘).remove() } $(‘#id_name‘).append(error_msg2); }else { var error_msg2 = $(‘<span class="pull-right" style="color: red" id="msg_error" >可以使用的用戶名 </span>‘); if (error_msg2) { $(‘#msg_error‘).remove() } $(‘#id_name‘).append(error_msg2); } } }) }) </script> </html>註冊功能頁面(手擼) index.html
from django.db import models # Create your models here. class User(models.Model): name=models.CharField(max_length=32) pwd=models.CharField(max_length=32) email=models.EmailField()models.py
Django forms組件