后端代码
from django import forms from django.forms import widgets from django.core.validators import RegexValidator class MyForm(forms.Form): username = forms.CharField(min_length=3, label='用户名', max_length=8, #输入错误后的值 error_messages={ 'required': '姓名不能为空', 'min_length': '最小3位数', 'max_length': '最大8位数', }, widget=widgets.TextInput(attrs={'class': 'form-control'})) password = forms.CharField(min_length=3, label='密码', max_length=8, error_messages={ 'required': '密码不能为空', 'min_length': '最小3位数', 'max_length': '最大8位数', }, widget=widgets.PasswordInput(attrs={'class': 'form-control'})) confirm_password = forms.CharField(min_length=3, label='确认密码', max_length=8, error_messages={ 'required': '确认密码不能为空', 'min_length': '最小3位数', 'max_length': '最大8位数', }, widget=widgets.PasswordInput(attrs={'class': 'form-control'})) email = forms.EmailField(label='Email', error_messages={ 'required':'邮箱不能为空', 'invalid': '格式错误' }, widget=widgets.EmailInput(attrs={'class': 'form-control'})) #RegexValidator验证器可以用正则匹配 phone = forms.CharField( validators=[RegexValidator(r'^[0-9]+$', '请输入数字'), RegexValidator(r'^159[0-9]+$', '数字必须以159开头')], ) #局部钩子当走完上面的form校验才会走这个局部钩子函数 def clean_username(self): username = self.cleaned_data.get('username') if username == 'hkk': self.add_error('username', '姓名存在') return username #全局钩子 def clean(self): password = self.cleaned_data.get('password') confirm_password = self.cleaned_data.get('confirm_password') if password != confirm_password: self.add_error('confirm_password', '密码不一致') return self.cleaned_data def index3(request): form_obj = MyForm() if request.method == 'POST': form_obj = MyForm(request.POST) #返回为布尔值如果校验成功返回True如果校验失败返回False if form_obj.is_valid(): #校验成功的后返回的字典 key为字段values为用户输入后正确的值 print(form_obj.cleaned_data) print(form_obj.errors) return render(request, 'text3.html', {'form_obj': form_obj})
前端代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" href="/static/bootstrap-3.3.7-dist/css/bootstrap.min.css"> </head> <body> <div class="row"> <div class="col-md-6 col-lg-offset-3"> <form action="" method="post" novalidate> {% for foo in form_obj %} <div class="form-group"> <label for="{{ foo.auto_id }}">{{ foo.label }}</label> {{ foo }} <span style="color: red">{{ foo.errors.0 }}</span> </div> {% endfor %} <input type="submit" value="提交"> </form> </div> </div> </body> <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script> <script src="/static/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script> </html>