Django的form,model自定制
一、Form组件原理:
django框架提供了一个form类,来处理web开发中的表单相关事项。众所周知,form最常做的是对用户输入的内容进行验证,为此django的forms类提供了全面的内容验证和保留用户上次输入数据的支持。
form组件有2大大功能
对用户提交的内容进行验证(from表单/Ajax)
保留用户上次输入的内容
form组件验证的流程
- obj=Form()form组件类实例化时找到类中所有的字段 把这些字段 变成组合成字典;self.fields={‘user’:正则表达式1,‘pwd’:正则表达式2}
- 循环self.fields字典(自己写的字段)for k,v in self.fields.items():,K是user,pwd,v是正则表达式
- 每次循环通过self.fields字典的键, 一个一个的去get前端POST提交的数据 得到用户输入数据;input_value= request.post.get(‘k’)(所以form字段的名称,要和前端的name属性匹配)
- 每次拿到用户输入的数据 (input_value)和进行正则表达式匹配;
- 匹配成功flag=True 匹配失败flag=falsh,最后 return flag obj.is_valid=flag。如果For自带的规则和正则满足不了验证需求,可在Form类中自定义方法,做扩展。
- 每个字段验证通过后,每个字段执执行self.clean_filelds函数(自定义 对Form类中的字段做单独验证,比如去数据库查询判断一下用户提交的数据是否存在?)
- 执行Form组件的clean_form方法进行整体验证!(既然每个字段都验证了,就可以对用户提交的数据做整体验证了!比如进行联合唯一的验证)
- 最后执行类似 clean_form的post_clean方法结束验证。(一般不使用post_clean做自定义过滤,clean_form方法完全可以解决)
form表单提交验证
form表单(会发起 get)提交刷新失去上次内容
from django.shortcuts import render,HttpResponse,redirect from django.forms import Form from django.forms import fields class Login(Form): #from验证规则 用户名 6-10字符 required不能为空 name=fields.CharField(max_length=10, min_length=6, required=True, error_messages={ 'required':'用户名不能为空', #error_messages参数 自定义错误信息 'min_length':'太短了', 'max_length': "太长了", } ) # z注意name 必须和 from表单提交的一致,要么二则怎么对比校验呢 pwd= fields.CharField(min_length=3, required=True, error_messages={ 'required': '密码不能为空', # error_messages参数 自定义错误信息 'min_length': '太短了', 'max_length': "太长了", } ) def index(request): if request.method=='GET': return render(request,'login.html') else: obj=Login(request.POST) #把客户端提交来的form表单和 和匹配规则放在一起 res=obj.is_valid() #自动校验 给出结果 True 或者 False if res: #验证成功后obj.cleaned_data获取成功的数据,字典类型正好对应数据 的批量操作 print(obj.cleaned_data) return redirect('http://www.baidu.com') #obj.errors获取错误信息(对象类型)就可以传到前端显示了! else: return render(request,'login.html',{'obj':obj})
Aja提交验证
Ajax不会刷新,上次输入内容自动保留
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>ajx提交</title> </head> <body> <form method="post" action="/aja_login/" id="f1"> {%csrf_token%} <p>用户:<input type="text" name="name"></p> <p>密码:<input type="password" name="pwd"></p> <p><input type="button" onclick="Ajxform()" value="aja提交"></p> </form> </body> <script src="/static/zhanggen.js"></script> <script> function Ajxform(){ $('.c1').remove() $.ajax({ url:'/alogin/', type:'POST', dataType:'JSON', data:$('#f1').serialize(), success:function (args) { if (args.status){ } else{ {# {status: false, msg: Object}#} {# console.log(args);#} {# Jquery循环服务端 传过来的 错误信息对象#} $.each(args.msg,function (index,value) { console.log(index,value); {# index----> name ["太短了"]#} {# value-----pwd["密码不能为空"]#} var tag=document.createElement('span'); tag.innerHTML= value[0]; tag.className='c1'; console.log(index); {# 寻找input下 属性为 name 和pwd的标签(字符串拼接) 在他们后半加 上tag标签也就是错误 信息 #} $('#f1').find('input[name="'+ index +'"]').after(tag) }) } }})} </script> </html>
views
from django.shortcuts import render,HttpResponse,redirect from django.forms import Form from django.forms import fields import json class Login(Form): #from验证规则 用户名 6-10字符 required不能为空 name=fields.CharField(max_length=10, min_length=6, required=True, error_messages={ 'required':'用户名不能为空', #error_messages参数 自定义错误信息 'min_length':'太短了', 'max_length': "太长了", } ) # z注意name 必须和 from表单提交的一致,要么二则怎么对比校验呢 pwd= fields.CharField(min_length=3, required=True, error_messages={ 'required': '密码不能为空', # error_messages参数 自定义错误信息 'min_length': '太短了', 'max_length': "太长了",}) def agx_login(request): ret={'status':True,'msg':None} if request.method=='GET': return render(request,'ajalogin.html') else: obj=Login(request.POST) ret['status']=False ret['msg']=obj.errors return HttpResponse(json.dumps(ret))
动态生成HTML标签,保留用户上次输入的内容
如何保留用户上次输入的内容?
由于form表单submit之后(发送post请求) 数据提交到 后端,不管前端输入的数据是否正确,服务端也要响应,所以页面会刷新;
所以无法保留用户上次输入的内容;如何解决呢?
- 把定义的定义的Form类,实例化(obj=Login() )内部调用一个__str__的方法,如果没有传值 返回<input type="text" name=“字段”>name='字段名空的input标签
- 把这个实例化之后的对象传到前端显示,让用户输入值;用户输入值通过post方法提交到后台。
- 如果后台实例化一个对象 obj=Login(request.POST)传入了值, <input type="text" name=“字段” value='request.post的数据'>然后后端再返回客户端就可以看到用户输入的值了!
保留用户上次输入的内容 是利用了 obj=Login(request.POST)接收了用户输入的值
承上启下 form组件的套路(执行流程):
(1)在后端定义类和字段,实例化Form类;
(2)到用户 发送get请求时,服务端渲染到模板(空标签/默认值)发送到客户端显示
(3)客户端填数据,POST提交到后端;
(4)后端验证,返回结果给前端;(切记Form组件是在后端生成,发送给客户端显示,客户端填完数据在发回服务端!)
原创作者:马一特
文章出处:http://www.cnblogs.com/mayite/
版权声明:自由转载-非商用-非衍生-保持署名
(创意共享4.0许可证)
转载说明:如果文章对您有帮助,欢迎点赞,评论加转载,赠人玫瑰,手留余香