Form介紹
我們之前在HTML頁面中利用form表單向后端提交數據時,都會寫一些獲取用戶輸入的標簽并且用form標簽把它們包起來。
與此同時我們在好多場景下都需要對用戶的輸入做校驗,比如校驗用戶是否輸入,輸入的長度和格式等正不正確。如果用戶輸入的內容有錯誤就需要在頁面上相應的位置顯示對應的錯誤信息.。
Django form組件就實現了上面所述的功能。
總結一下,其實form組件的主要功能如下:
生成頁面可用的HTML標簽 對用戶提交的數據進行校驗 保留上次輸入內容先在應用目錄下my_forms.py定義好一個UserForm類
from django import forms from django.forms import widgets class UserForm(forms.Form): username = forms.CharField(min_length=4, label='用戶名', widget=widgets.TextInput(attrs={"class": "form-control"}), error_messages={ "required": "用戶名不能為空", }) pwd = forms.CharField(min_length=4, label='密碼', error_messages={ "required": "密碼不能為空", }, widget=widgets.PasswordInput(attrs={"class": "form-control"})) r_pwd = forms.CharField(min_length=4, label='確認密碼', widget=widgets.PasswordInput(attrs={"class": "form-control"}), error_messages={ "required": "密碼不能為空", }) email = forms.EmailField(label='郵箱', widget=widgets.EmailInput(attrs={"class": "form-control"}), error_messages={ "required": '郵箱不能為空', "invalid": "郵箱格式錯誤", }) tel = forms.CharField(label='手機號', widget=widgets.TextInput(attrs={"class": "form-control"}), )
再寫一個視圖函數:
在寫一個視圖函數
def reg(request): form = UserForm() if request.method == "POST": print(request.POST) # 實例化form對象的時候,把post提交過來的數據直接傳進去 form = UserForm(request.POST) # form表單的name屬性值應該與forms組件的字段名稱一致 if form.is_valid(): print(form.cleaned_data) return HttpResponse('注冊成功') return render(request, 'reg.html', locals())
login.html
<!DOCTYPE html> <html lang="zh_CN"> <head> <meta charset="UTF-8"> <meta http-equiv="x-ua-compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>注冊</title> </head> <body> <h3>傳統form表單</h3> <form action="" method="post"> {% csrf_token %} <p>用戶名:<input type="text" name="username"></p> <p>密碼:<input type="password" name="pwd"></p> <p>確認密碼:<input type="password" name="r_pwd"></p> <p>郵箱:<input type="email" name="email"></p> <p>手機號:<input type="tel" name="tel"></p> <p><input type="submit" value="提交"></p> </form> <h3>forms組件渲染方式1</h3> <form action="" method="post" novalidate> {% csrf_token %} <p>{{ form.username.label }}:{{ form.username }} <span>{{ form.username.errors.0 }}</span></p> <p>密碼:{{ form.pwd }} <span>{{ form.pwd.errors.0 }}</span></p> <p>確認密碼:{{ form.r_pwd }} <span>{{ form.r_pwd.errors.0 }}</span></p> <p>郵箱:{{ form.email }} <span>{{ form.email.errors.0 }}</span></p> <p>手機號:{{ form.tel }} <span>{{ form.tel.errors.0 }}</span></p> <p><input type="submit" value="提交"></p> </form> <h3>forms組件渲染標簽方式2</h3> <form action="" method="post" novalidate> {% csrf_token %} {% for field in form %} <div class="form-group clearfix"> <label for="">{{ field.label }}</label> {{ field }} <span style="color: red" class="pull-right">{{ field.errors.0 }}</span> {% if field.name == 'r_pwd' %} <span style="color: red" class="pull-right">{{ errors.0 }}</span> {% endif %} </div> {% endfor %} <input type="submit" value="注冊" class="btn btn-default pull-right"> </form> <h3>forms組件渲染標簽方式3 不推薦使用</h3> <form action="" method="post"> {% csrf_token %} {{ form.as_p }} <input type="submit" value="注冊"> </form> </body> </html>
新聞熱點
疑難解答