Django框架form表单验证 修改html标签的样式

鳄鱼君

发表文章数:643

Vieu四代商业主题

高扩展、安全、稳定、响应式布局多功能模板。

¥69 现在购买
首页 » Python » Django框架form表单验证 修改html标签的样式

经过前面的学习,我们大致可以知道CharField、EmailField等等以Field结尾的方法,只能帮助我们对用户发来的信息做验证,不能生成html标签。字段本身自己虽然只做验证,但是我们可以通过obj.as_p、obj.as_ul、obj.as_table来自动生成html标签,其实在内部也是通过字符串拼接的。

在内部,使用的是插件,来帮助我们自动生成html标签。我们可以查看一下源代码,在fields.py源码文件中,发现了默认的插件TextInput,往上接着找它的父类发现:

class TextInput(Input):
    input_type = 'text'
    template_name = 'django/forms/widgets/text.html'

在django3.0.5版本中,使用的是模板的方式来定义默认的标签,

如果现在想要定义一个多行文本,只需要修改添加插件即可:

from django import forms
from django.forms import widgets
class FormObj(forms.Form):
    #name值必须一样
    user=forms.CharField(
        error_messages={'required':'用户名不能为空'},
        widget=widgets.Textarea(attrs={'class':'a1'}),#添加多行文本,并定义class属性
    )

    pwd=forms.CharField(
        max_length=12,
        min_length=6,
        error_messages={'required':'密码不能为空','min_length':'密码长度不能小于6','max_length':'密码长度不能大于12'}
    )  #密码为字符串
    email=forms.EmailField(error_messages={'required':'邮箱不能为空','invalid':'邮箱格式错误'})
    #邮箱格式错误会出现invalid提示

这样就为多选框定义了一个class属性,我们可以对其添加样式。那么现在就牛逼了,我们在form中可以定义页面显示的插件,插件可以自定义样式,那么就可以随意修改了。以下是django推荐使用的方式:

from django import forms
from django.forms import widgets #导入所有的插件
from django.forms import fields  #导入fields
class FormObj(forms.Form):
    #name值必须一样
    user=fields.CharField(
        error_messages={'required':'用户名不能为空'},
        widget=widgets.Textarea(attrs={'class':'a1'}),#添加多行文本,并定义class属性
    )
    pwd=fields.CharField(
        max_length=12,
        min_length=6,
        error_messages={'required':'密码不能为空','min_length':'密码长度不能小于6','max_length':'密码长度不能大于12'},
        widget=widgets.PasswordInput(),  # 定义密码的插件
    )  #密码为字符串
    email=fields.EmailField(
        error_messages={'required':'邮箱不能为空','invalid':'邮箱格式错误'},
    )

插件非常齐全,几乎什么都有,input、select、checkbox、redio等等了,可参考:Django框架中Form表单验证时常用选择插件。现在我们又知道了,字段可以帮我们验证用户信息,在内部可以使用插件来生成html标签。对于django的字段,需要在这里整理出来:

Field    #所有字段的基类
    required=True,               是否允许为空
    widget=None,                 HTML插件
    label=None,                  用于生成Label标签或显示内容,左边显示的内容
    initial=None,                初始值 ,默认值
    help_text='',                帮助信息(在标签旁边显示)
    error_messages=None,         错误信息 {'required': '不能为空', 'invalid': '格式错误'}
    show_hidden_initial=False,   是否在当前插件后面再加一个隐藏的且具有默认值的插件(可用于检验两次输入是否一直)
    validators=[],               自定义验证规则,自定义正则表达式验证
    localize=False,              是否支持本地化
    disabled=False,              是否可以编辑
    label_suffix=None            Label内容后缀
 
 
CharField(Field)  #参数可以为下面,Field的参数也可以使用
    max_length=None,             最大长度
    min_length=None,             最小长度
    strip=True                   是否移除用户输入空白
 
IntegerField(Field)
    max_value=None,              最大值
    min_value=None,              最小值
 
FloatField(IntegerField)
    ...
 
DecimalField(IntegerField)
    max_value=None,              最大值
    min_value=None,              最小值
    max_digits=None,             总长度
    decimal_places=None,         小数位长度
 
BaseTemporalField(Field)
    input_formats=None          时间格式化   
 
DateField(BaseTemporalField)    格式:2015-09-01
TimeField(BaseTemporalField)    格式:11:12
DateTimeField(BaseTemporalField)格式:2015-09-01 11:12
 
DurationField(Field)            时间间隔:%d %H:%M:%S.%f
    ...
 
RegexField(CharField)   #等于CharField(validators=)
    regex,                      自定制正则表达式
    max_length=None,            最大长度
    min_length=None,            最小长度
    error_message=None,         忽略,错误信息使用 error_messages={'invalid': '...'}
 
EmailField(CharField)      
    ...
 
FileField(Field)
    allow_empty_file=False     是否支持空文件0kb
 
ImageField(FileField)      
    ...
    注:需要PIL模块,pip3 install Pillow
    以上两个字典使用时,需要注意两点:
        - form表单中 enctype="multipart/form-data"
        - view函数中 obj = MyForm(request.POST, request.FILES)
 
URLField(Field)
    ...
 
 
BooleanField(Field)  
    ...
 
NullBooleanField(BooleanField)
    ...
 
ChoiceField(Field)
    ...
    choices=(),                选项,如:choices = ((0,'上海'),(1,'北京'),)
    required=True,             是否必填
    widget=None,               插件,默认select插件
    label=None,                Label内容
    initial=None,              初始值
    help_text='',              帮助提示
 
 
ModelChoiceField(ChoiceField)
    ...                        django.forms.models.ModelChoiceField
    queryset,                  # 查询数据库中的数据
    empty_label="---------",   # 默认空显示内容
    to_field_name=None,        # HTML中value的值对应的字段
    limit_choices_to=None      # ModelForm中对queryset二次筛选
     
ModelMultipleChoiceField(ModelChoiceField)
    ...                        django.forms.models.ModelMultipleChoiceField
 
 
     
TypedChoiceField(ChoiceField)
    coerce = lambda val: val   对选中的值进行一次转换
    empty_value= ''            空值的默认值
 
MultipleChoiceField(ChoiceField)
    ...
 
TypedMultipleChoiceField(MultipleChoiceField)
    coerce = lambda val: val   对选中的每一个值进行一次转换
    empty_value= ''            空值的默认值
 
ComboField(Field)
    fields=()                  使用多个验证,如下:即验证最大长度20,又验证邮箱格式
                               fields.ComboField(fields=[fields.CharField(max_length=20), fields.EmailField(),])
 
MultiValueField(Field)
    PS: 抽象类,子类中可以实现聚合多个字典去匹配一个值,要配合MultiWidget使用
 
SplitDateTimeField(MultiValueField)
    input_date_formats=None,   格式列表:['%Y--%m--%d', '%m%d/%Y', '%m/%d/%y']
    input_time_formats=None    格式列表:['%H:%M:%S', '%H:%M:%S.%f', '%H:%M']
 
FilePathField(ChoiceField)     文件选项,目录下文件显示在页面中
    path,                      文件夹路径
    match=None,                正则匹配
    recursive=False,           递归下面的文件夹
    allow_files=True,          允许文件
    allow_folders=False,       允许文件夹
    required=True,
    widget=None,
    label=None,
    initial=None,
    help_text=''
 
GenericIPAddressField
    protocol='both',           both,ipv4,ipv6支持的IP格式
    unpack_ipv4=False          解析ipv4地址,如果是::ffff:192.0.2.1时候,可解析为192.0.2.1, PS:protocol必须为both才能启用
 
SlugField(CharField)           数字,字母,下划线,减号(连字符)
    ...
 
UUIDField(CharField)           uuid类型
    ...

字段类型比较多,本质都是正则表达式,只不过django帮我们写好了。其中label参数显示的是左边的内容,你可以使用下面的代码看一下显示结果:

 user=fields.CharField(
        error_messages={'required':'用户名不能为空'},
        label='用户名',
    )

<form action="/login/" method="post">
     {% csrf_token %}
    <p>{{ obj.user.label }}{{ obj.user }}{{ obj.errors.user.0 }}</p>
    <p>{{ obj.pwd }}{{ obj.errors.pwd.0 }}</p>
    <p>{{ obj.email }}{{ obj.errors.email.0 }}</p>
    <input type="submit" value="登录">

</form>

有关自定义验证规则可参考:Django框架自定义Form表单验证规则

未经允许不得转载:作者:鳄鱼君, 转载或复制请以 超链接形式 并注明出处 鳄鱼君
原文地址:《Django框架form表单验证 修改html标签的样式》 发布于2020-04-26

分享到:
赞(0) 赏杯咖啡

评论 抢沙发

4 + 3 =


文章对你有帮助可赏作者一杯咖啡

支付宝扫一扫打赏

微信扫一扫打赏

Vieu4.6主题
专业打造轻量级个人企业风格博客主题!专注于前端开发,全站响应式布局自适应模板。
切换注册

登录

忘记密码 ?

您也可以使用第三方帐号快捷登录

Q Q 登 录
微 博 登 录
切换登录

注册