Django form组件 - 神奇的后端直接渲染HTML

 前言

之前在HTML页面中利用form表单向后端提交数据时会写一些获取用户输入的标签并且使用form标签将其包裹起来。并且很多场景下都需要对用户的输入做校验,比如用户输入的长度和格式等,如果用户输入的有误就需要在页面上相应的位置显示相应的错误信息。而django form组件实现了上面所述的功能。

form组件功能

总结起来,django from组件的主要功能有以下三点:

①生成页面可用的HTML标签;

②对用户提交的数据进行校验;

③保留上次输入的内容。

form组件基本使用

form组件的使用和django模型非常类似,现在应用下的views.py中定义好form类,代码如下:

# views.py
from django import forms
class MyForm(forms.Form):'''# username字符串类型最小3位最大8位# password字符串类型最小3位最大8位# email字段必须符合邮箱格式  xxx@xx.com# label属性用来指定字段展示信息'''# username字符串类型,最小3位,最大8位username = forms.CharField(max_length=8,min_length=3, lable='用户名')# password,字符串类型,最小3位,最大8位password = forms.CharField(max_length=8,min_length=3, lable='密码')# email字段必须符合邮箱格式email = forms.EmailField(lable='邮箱')

测试form组件的环境也有两种方式,一种方式同样是通过test.py,另一种方式就是通过pycharm的测试环境Python console,这里采用第二种方式进行测试。

# 1 导入需要测试的文件
from first import views# 2 将需要校验的数据组织成字典的形式传入自定义的form类进行校验
form_obj = views.MyForm({'username':'python',,'emali':'123'})# 3 判断数据是否合法:注意该方法只有在所有的数据全部合法的情况下才会返回True
form_obj.is_valid()  # False# 4 查看所有通过校验的数据
form_obj.cleaned_data  # {'username': 'python', }# 5 查看所有不符合校验规则的字段和不符合原因,错误原因是列表,因为可能错误原因有多个
form_obj.errors  # {'email': ['Enter a valid email address.']}# 6 如果校验数据中出现了类中没有的字段,forms组件只会校验存在的字段,不存在的字段传了直接忽略
form_obj = views.MyForm({'username':'python',,'emali':'123@qq.com','hobby':'read'})
form_obj.is_valid()  # True# 7 默认情况下,类里面所有的字段都必须传值,也就意味着校验数据的时候,默认情况下数据可以多传但是不能少传
form_obj = views.MyForm({'username':'jason',})
form_obj.is_valid()  # False

form组件的校验规则可以总结出以下方法:

给MyForm传值实例化对象,传值方式:将带校验的字段和数据组织成字典的形式
is_valid()		该方法只有在所有的数据全部合法的情况下才会返回True
cleaned_data	查看所有校验通过的数据
errors			查看所有不符合校验规则以及不符合的原因,{key: ['']}
has_error()		判断某一个字段是否不合法,不合法返回True校验数据只校验类中出现的字段,多传不影响,多传的字段直接忽略
校验数据 默认情况下 类里面所有的字段都必须传值,即少传肯定不合法

form组件渲染标签

上面提到form组件可以自动帮忙渲染获取用户输入的标签(input select radio checkbox),但是不能自动渲染提交按钮,那么是如何实现的呢?首先是后端的代码,在views.py中书写视图函数:

# views.py
def index(request):# 先产生一个空对象form_obj = MyForm()if request.method == 'POST':# 获取用户数据进行校验,如果一条一条的获取用户数据太过繁琐,而且校验数据需要字典格式,而request.POST获取到的数据格式就是queryset——dict对象form_obj = MyForm(request.POST)# 如果数据合法应该操作数据库,这里先简写if form_obj.is_valid():return HttpResponse('OK')# 如果是get请求返回直接将空对象传递给html页面return render(request,'register.html',locals())

如果数据不合法需要将错误信息展示到前端,那么如何将错误信息展示到前端呢?因为form校验产生的错误信息就是字典格式,到前端就是自定义对象,所以可以通过前端点点点的方式,下面是前端register.html页面

<body>
<form action="" method="post" novalidate>  <!--novalidate参数阻止浏览器自动校验-->{% for form in form_obj %}<p>{{ form.label }} : {{ form }}<!--span是预留的展示错误信息的标签,form.errors.0的意思是只展示第一条错误提示,否则forms组件会将错误信息展示成无序列表的形式--><span style="color: red">{{ form.errors.0 }}</span></p>{% endfor %}<input type="submit">
</form>
</form>
</body>

错误信息在前端显示都是英文的,能不能改成中文的呢?可以通过参数error_messages来自定制错误信息。

class MyForm(forms.Form):'''error_messages参数需要构造成字典的数据结构,key是校验条件,value是校验失败时的提示信息'''username = forms.CharField(min_length=5,max_length=12,label='用户名',error_messages={'min_length': '用户名不能少于5位','max_length': '用户名不能超多12位','required': '用户名不能为空',})password = forms.CharField(min_length=6, max_length=12, label='密码')re_password = forms.CharField(min_length=6, max_length=12, label='确认密码')email = forms.EmailField(label='邮箱')

HOOK钩子函数

上述form组件的基本使用只是对数据的第一层校验,很多时候对参数还需要一些特殊的校验规则,这时候就可以使用钩子函数,钩子函数在form组件中类似于第二道校验,能够让我们自定义校验规则,校验流程通过第一层校验之后就会来到钩子函数,可以在钩子函数中进一步定制校验规则,钩子函数分为两种分别是局部钩子和全局钩子,钩子函数定义在form类中。

局部钩子

当需要给单个字段增加校验规则的时候就可以使用局部钩子了。比如规定用户名中不能包含hook

# views.py
class MyForm(forms.Form):username = forms.CharField(min_length=5,max_length=12,label='用户名',error_messages={'min_length':'用户名不能少于5位','max_length':'用户名不能超多12位','required':'用户名不能为空',})def clean_username(self):username = self.cleaned_data.get('username')if '666' in username:self.add_error('username', '中包含了hook')return username

定义局部钩子函数可以总结为以下几点:

①局部钩子的函数名为:clean_字段(),字段就是自定义校验规则的字段;

②该方法中在cleaned_data中获取该字段的数据,局部钩子中只能拿到当前字段的数据;

③校验数据失败时,通过add_error方法给字段添加错误信息;

④局部钩子取出的字段数据一定要返回出去。

全局钩子

当需要给多个字段增加校验规则的时候可以使用全局钩子。比如校验两次密码输入是否一致:

# views.py
class MyForm(forms.Form):password = forms.CharField(min_length=6, max_length=12, label='密码')re_password = forms.CharField(min_length=6, max_length=12, label='确认密码')def clean(self):password = self.cleaned_data.get('password')re_password = self.cleaned_data.get('re_password')if password != re_password:self.add_error('re_password', '两次密码输入不一致')return self.cleaned_data

定义全局钩子函数可以总结为以下几点:

①全局钩子可以在cleaned_data内获得任意字段的数据;

②全局钩子取出的cleaned_data一定要返回出去。

form组件参数介绍

首先是常用参数:

min_length			最少几位字符
max_length			最多几位字符
label				字段名
required  			控制字段是否必填(默认required=True)
error_messages  	自定义报错信息,字典的结构
initial  			初始值,input框里面的初始值value

HTML页面上的标签可以修改属性,那么form组件是直接渲染的,如何修改标签的属性呢?就是通过widget参数,通过该参数可以修改标签的属性。

class MyForm(forms.Form):username = forms.CharField(min_length=5,max_length=12,widget=forms.widgets.TextInput(attrs={'class': 'form-control'}))"""
总结:
widget=forms.widgets.TextInput()默认是TextInput(及input[type='text'])
widget=forms.widgets.PasswordInput()密码格式
widget=forms.widgets.EmailInput()邮箱格式attrs提供字段的属性,可以是内置的也可以是自定义的;如有多个class:空格隔开即可。
"""

另外在第一道校验规则中,还支持正则校验,就是通过validators参数进行正则校验:

from django import forms
from django.core.validators import RegexValidatorclass MyForm(forms.Form):phone = forms.CharField(label='手机号',validators=[RegexValidator(r'^[0-9]+$', '请输入数字'),RegexValidator(r'^159[0-9]+$', '数字必须以159开头')],)"""
总结:
validators的值是一个列表,烈面可以更多个正则表校验条件
RegexValidator第一个参数是正则表校验条件,第二个是校验失败是的提示信息"""

form组件其他标签渲染

form组件不止能对input框进行渲染,也支持对radio select checkbox标签进行渲染:

# radio单选
gender = forms.ChoiceField(choices=((1, "男"), (2, "女"), (3, "保密")),label="性别",initial=1,widget=forms.widgets.RadioSelect()
)# checkbox多选
hobby = forms.MultipleChoiceField(choices=((1, "篮球"), (2, "足球"), (3, "双色球"),),label="爱好",initial=[1, 3],widget=forms.widgets.CheckboxSelectMultiple()
)# 下拉单选:即使添加attrs={'multiple': 'multiple'}任然为单选
hobby2 = forms.ChoiceField(choices=((1, "篮球"), (2, "足球"), (3, "双色球"),),label="爱好",initial=3,widget=forms.widgets.Select()
)# 下拉多选
hobby3 = forms.MultipleChoiceField(choices=((1, "篮球"), (2, "足球"), (3, "双色球"),),label="爱好2",initial=[1, 3],widget=forms.widgets.SelectMultiple()
)# 选择checkbox是否选择, initial空表示False, 只要有值就是True默认选中(任何值都可以)
keep = forms.ChoiceField(choices=(('False', 0), ('True', 1)),label="是否记住密码",initial='',widget=forms.widgets.CheckboxInput()
)

在使用choice参数时如果choices展示的数据是动态从数据库中获取的,还需要额外的设置:

class BookAddForm(forms.Form):name = forms.CharField(label='图书名称',error_messages={'required': '图书名称不能为空'},widget=forms.widgets.TextInput())price = forms.DecimalField(label='价格',error_messages={'required': '图书价格不能为空'},widget=forms.widgets.TextInput())publish_date = forms.DateField(label='出版日期',error_messages={'required': '出版日期不能为空'},widget=forms.widgets.DateInput())publish_id = forms.ChoiceField(label='出版社',error_messages={'required':'出版社不能为空'},widget=forms.widgets.Select())author = forms.MultipleChoiceField(label='作者',error_messages={'required':'作者不能为空'},widget=forms.widgets.SelectMultiple())def __init__(self, *args, **kwargs):super().__init__(*args, **kwargs)# choices字段的数据动态来自数据库self.fields['publish_id'].choices = models.Publish.objects.values_list('pk', 'name')self.fields['author'].choices = models.Author.objects.values_list('pk', 'name')

最后感谢每一个认真阅读我文章的人,礼尚往来总是要有的,这些资料,对于【软件测试】的朋友来说应该是最全面最完整的备战仓库,虽然不是什么很值钱的东西,如果你用得到的话可以直接拿走:

这些资料,对于【软件测试】的朋友来说应该是最全面最完整的备战仓库,这个仓库也陪伴上万个测试工程师们走过最艰难的路程,希望也能帮助到你! 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/682037.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

RBF神经网络中的RBF的英文全称是什么,是用来干什么的?

问题描述&#xff1a;RBF神经网络中的RBF的英文全称是什么&#xff0c;是用来干什么的&#xff1f; 问题解答&#xff1a; RBF神经网络中的RBF是径向基函数&#xff08;Radial Basis Function&#xff09;的缩写。径向基函数是一种在机器学习和模式识别中常用的函数类型&…

数据库从入门到精通(一)数据库基础操作

mysql数据库基础操作 cmd下启动mysql数据库操作命令数据库重要的删除操作数据库增删改查操作插入数据更新数据删除数据查询数据查询指定记录in查询满足指定范围之内的条件记录not in查询不在指定范围之内的条件记录带between and 的范围查询带like的字符匹配查询(d%以d开头,%d以…

猫头虎分享已解决Bug || SyntaxError: Unexpected token o in JSON at position 1 ‍

博主猫头虎的技术世界 &#x1f31f; 欢迎来到猫头虎的博客 — 探索技术的无限可能&#xff01; 专栏链接&#xff1a; &#x1f517; 精选专栏&#xff1a; 《面试题大全》 — 面试准备的宝典&#xff01;《IDEA开发秘籍》 — 提升你的IDEA技能&#xff01;《100天精通鸿蒙》 …

【MATLAB】小波神经网络回归预测算法

有意向获取代码&#xff0c;请转文末观看代码获取方式~也可转原文链接获取~ 1 基本定义 小波神经网络回归预测算法是一种利用小波变换和人工神经网络相结合的方法&#xff0c;用于解决回归预测问题。下面将详细介绍该算法的原理与方法&#xff1a; 小波变换&#xff1a; 小波变…

rocketMQ下载、安装及配置

topic主题 - 里边存在多个队列&#xff08;队列是真实存在的&#xff09; rocketMQ安装及配置 一、官网下载 windows和linux系统版本都一样。Binary 下载 下载 | RocketMQ (apache.org) 二、修改运行内存及broker.conf、配置环境变量 1、修改根目录->bin目录下runserve…

如何生成一个修仙世界的狗血短剧剧本2

如何生成一个修仙世界的狗血短剧剧本2 生成一个修仙世界的狗血短剧剧本对话 生成一个修仙世界的狗血短剧剧本 剧本名称&#xff1a;《仙途情缘》 角色&#xff1a; 易天行&#xff1a;男主角&#xff0c;天赋异禀的修仙者&#xff0c;性格坚毅&#xff0c;正直善良。梦瑶&…

ACM训练题:互不侵犯

一看数据范围&#xff0c;如果是枚举所有的棋盘情况&#xff0c;2^K&#xff0c;肯定超了&#xff0c;自然是要一行一行递推&#xff0c;而相邻这个情况用位运算会比较方便&#xff0c;所以用状压dp。 具体算法&#xff1a;dp[i][j][k]表示第i行&#xff0c;前i行有j个棋子&…

P5440 【XR-2】奇迹 (大模拟dfs+欧拉筛板子+闰年)

传送门https://www.luogu.com.cn/problem/P5440 相信奇迹的人&#xff0c;本身就和奇迹一样了不起。——笛亚 《星游记》 思路历程&#xff1a;很离谱的一题&#xff0c;在理论上并不困难&#xff0c;只要简单dfs欧拉筛就能过。在一开始&#xff0c;我采用了倒着模拟的思路&am…

Zig、C、Rust的Pk1

Zig、C、Rust的Pk1 github.com上看到“A basic comparitive analysis of C, C, Rust, and Zig.”&#xff1a;https://github.com/CoalNova/BasicCompare/tree/main 里边的代码是9个月之前的&#xff0c;用现在的zig 0.11.0 及0.12-dev都无法通过编译(具体为&#xff1a;zig-w…

微信,支付宝在线换钱平台系统源码

探索全新、全开源的在线换钱系统源码&#xff0c;它将以前所未有的方式改变您的支付体验。我们为您精心打造了一个集简单易用与安全高效于一身的优质产品&#xff0c;它采用最新的技术开发&#xff0c;为您带来前所未有的便捷与安心。 这款在线换钱系统源码设计直观&#xff0…

AI:127-基于卷积神经网络的交通拥堵预测

🚀点击这里跳转到本专栏,可查阅专栏顶置最新的指南宝典~ 🎉🎊🎉 你的技术旅程将在这里启航! 从基础到实践,深入学习。无论你是初学者还是经验丰富的老手,对于本专栏案例和项目实践都有参考学习意义。 ✨✨✨ 每一个案例都附带有在本地跑过的关键代码,详细讲解供…

error An unexpected error occurred: “https://registry.npm.taobao.org

背景&#xff1a; 想使用yarn命令结果报错 问题原因&#xff1a; 原来证书到期了 http://registry.npm.taobao.org/ 把这个放到浏览器搜索的时候自动换成https://registry.npmmirror.com/ 方案&#xff1a; npm cache clean --forcenpm config set registry https://registry…

政安晨:示例演绎机器学习中(深度学习)神经网络的数学基础——快速理解核心概念(一){两篇文章讲清楚}

进入人工智能领域免不了与算法打交道&#xff0c;算法依托数学基础&#xff0c;很多小伙伴可能新生畏惧&#xff0c;不用怕&#xff0c;算法没那么难&#xff0c;也没那么玄乎&#xff0c;未来人工智能时代说不得人人都要了解算法、应用算法。 本文试图以一篇文章&#xff0c;…

智胜未来,新时代IT技术人风口攻略-第二版(弃稿)

文章目录 抛砖引玉 鸿蒙生态小科普焦虑之下 理想要落到实处校园鼎力 鸿蒙发展不可挡培训入场 机构急于吃红利企业布局 鸿蒙应用规划动智胜未来 技术人风口来临 鸿蒙已经成为行业的焦点&#xff0c;未来的发展潜力无限。作为一名程序员兼UP主&#xff0c;我非常荣幸地接受了邀请…

Acwing---844.走迷宫

走迷宫 1.题目2.基本思想3.代码实现 1.题目 给定一个 nm 的二维整数数组&#xff0c;用来表示一个迷宫&#xff0c;数组中只包含 0 或 1&#xff0c;其中 0 表示可以走的路&#xff0c;1 表示不可通过的墙壁。最初&#xff0c;有 一个人位于左上角 (1,1)处&#xff0c;已知该…

VMware清理拖拽缓存 Ubuntu硬盘情况占用分析

这两天在尝试编译Linux源码&#xff0c;我在win上将源码下载下来然后复制到ubuntu上&#xff0c;这一步我粗略看到了三种方法&#xff1a;安装VM tools&#xff0c;就可以使文件正常的在win和ubuntu中复制剪切&#xff1b;使用scp命令将win和linux系统链接起来&#xff1b;使用…

幻兽帕鲁Palworld专用服务器CPU内存配置怎么选择?

腾讯云幻兽帕鲁服务器配置怎么选&#xff1f;根据玩家数量选择CPU内存配置&#xff0c;4到8人选择4核16G、10到20人玩家选择8核32G、2到4人选择4核8G、32人选择16核64G配置&#xff0c;腾讯云百科txybk.com来详细说下腾讯云幻兽帕鲁专用服务器CPU内存带宽配置选择方法&#xff…

鸿蒙开发系列教程(二十)--页面间动画

页面间动画 两个页面间发生跳转&#xff0c;一个页面消失&#xff0c;另一个页面出现&#xff0c;这时可以配置各自页面的页面转场参数实现自定义的页面转场效果 页面进入&#xff1a; PageTransitionEnter({type?: RouteType,duration?: number,curve?: Curve | string,…

【Java程序设计】【C00269】基于Springboot的漫画网站(有论文)

基于Springboot的漫画网站&#xff08;有论文&#xff09; 项目简介项目获取开发环境项目技术运行截图 项目简介 这是一个基于Springboot的漫画网站 本系统分为系统功能模块、管理员功能模块、以及用户功能模块。 系统功能模块&#xff1a;在系统首页可以查看首页、漫画投稿、…

CTFshow web(php命令执行 68-71)

web68 还是那句话&#xff0c;没看到flag在哪&#xff0c;那就优先找到flag位置 这里cvar_dump(scandir("/")); 直接输出根目录的位置&#xff0c;然后查看源代码&#xff0c;发现flag位置为flag.txt 知道flag在根目录下面的flag.txt直接访问就好了 cinclude(/flag…