django form元件
阿新 • • 發佈：2018-12-20
-form元件
需求：
1、重複的寫驗證邏輯，正則表示式
2、不能夠儲存上一次使用者輸入的資料
先解決第一個問題，重複的寫驗證邏輯，正則表示式
django提供的form元件：
1、引入form包：
from django.forms import fields,Form
2、定義規則：
class LoginForm(Form): username = fields.CharField(max_length=4, min_length=2, required=True, error_messages={ "required": "不能為空", "min_length": "最低輸入2兩個", "max_length": "最多輸入4個" })#
3、使用：
obj = LoginForm(request.POST)
判斷結果：
obj.is_valid()
正確資料：
obj.cleaned_data
錯誤資訊：
obj.errors
4、前段頁面展示錯誤資訊
<input type="text" name="username">{{ obj.errors.username.0}}例如：
from django.shortcuts import render,HttpResponse
from django.forms import fields,Form
class LoginForm(Form):
username = fields.CharField(max_length=4,
min_length=2,
required=True,
error_messages={
"required": "不能為空",
"min_length": "最低輸入2兩個",
"max_length": "最多輸入4個"
})#
def login(req):
if req.method == "GET":
return render(req,"login.html")
else:
obj = LoginForm(req.POST)
if obj.is_valid():#is_valid()是根據LoginForm裡的欄位引數判斷的,底層是正則匹配
return HttpResponse("ok")
else:
return render(req, "login.html", {"obj": obj})網頁前端：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<form action="/login/" method="post">
{% csrf_token %}
<p>
<input type="text" name="username">{{ obj.errors.username.0}}
<input type="submit" value="提交">
</p>
</form>
</body>
</html>field的引數設定
所有的欄位例如charfield都繼承自field這個父類，
required=True,#此欄位是否必須不為空
widget=None,#html外掛
label=None,#用於生產標籤或顯示內容
initial=None,#初始值
help_text='',#幫助資訊（在標籤旁邊顯示）
error_messages=None,#錯誤資訊 "required": "不能為空"
validators=(),#自定義驗證規則
localize=False,#是否支援本地化（時間）
disabled=False,#是夠可以編輯
label_suffix=None#label內容字尾
所以所有欄位都支援這些引數
class LoginForm(Form):
username = fields.CharField(max_length=4,
min_length=2,
required=True,
label="賬號",
label_suffix=":",
initial="555",
disabled=True,
help_text="幫助資訊",
error_messages={
"required": "不能為空",
"min_length": "最低輸入2兩個",
"max_length": "最多輸入4個"
})#
def login(req):
if req.method == "GET":
obj = LoginForm()#產生的是以上設定後產生的標籤，直接返給前端使用
return render(req,"login.html",{"obj":obj})
else:
obj = LoginForm(req.POST)
if obj.is_valid():#is_valid()是根據LoginForm裡的欄位引數判斷的,底層是正則匹配
return HttpResponse("ok")
else:
return render(req, "login.html", {"obj": obj})
列印obj顯示的html標籤
<tr>
<th>
<label for="id_username">賬號:</label>
</th>
<td><input type="text" name="username" value="555" maxlength="4" minlength="2" required disabled id="id_username" />
<br />
<span class="helptext">幫助資訊</span>
</td>
</tr>前端：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<form action="/login/" method="post">
{% csrf_token %}
<p>
{{ obj }}
</p>
</form>
</body>
</html>
第二個問題，儲存使用者上一次輸入的資料
5 obj = LoginForm()
-幫助生產前段程式碼
-幫助留住使用者上一次輸入的資料,
後臺不變，前端網頁修改成以下，則可以實現在輸入錯誤的情況下儲存使用者上一次輸入的資料。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<form action="/login/" method="post" novalidate>
{% csrf_token %}
<p>
{{ obj.username.label }}{{ obj.username }}{{ obj.errors.username.0 }}
</p>
<input type="submit" value="提交">
</form>
</body>
</html>widget外掛
from django.forms import Textarea,Widgetwidget是外掛 在欄位的引數裡設定，Textarea是文字輸入框，還有密碼框等等其他框，使用便利，不用自己在前端設定。
前端容錯驗證外掛 jquery validate：
前後端一定要容錯驗證