zoukankan      html  css  js  c++  java
  • form组件简介

    一,form组件介绍

      我们需要在好多场景下都需要对用户的输入做校验,比如校验用户是否输入,输入长度和格式等正不正确。如果输入的内容有错误就需要在页面上相应的位置显示对应的错误信息。

      form组件功能:

        1,生成页面可用的HTML标签

        2,对用户提交的数据进行校验

        3,保留上次输入内容

    二,渲染标签

      第一个种方式:

    <h1>第一种渲染方式(可扩展性较差)</h1>
    {{ form_obj.as_p }}
    {{ form_obj.as_ul }}

      第二种方式:

    <h1>第二种渲染方式</h1>
    <form action="">
        <p>{{ form_obj.name.label }}{{ form_obj.name }}</p>
        <p>{{ form_obj.password.label }}{{ form_obj.password }}</p>
        <p>{{ form_obj.email.label }}{{ form_obj.email }}</p>
        <input type="submit">
    </form>

      第三种方式:

    <h1>第三种渲染标签的方式</h1>
    {#novalidate:前端取消校验#}
    <form action="" method="post" novalidate>
        {% for foo in form_obj %}
            <p>
                {{ foo.label }}{{ foo }}
                <span>{{ foo.errors.0 }}</span>
            </p>
        {% endfor %}
        <input type="submit">
    </form>

    三,校验数据  

      第一步:需要一个form类

    class MyForm(forms.Form):
        name = forms.CharField(max_length=6)
        password = forms.CharField(max_length=8, min_length=3)
        email = forms.EmailField(required=True)

      第二步:定一个函数,在函数中实例化form对象

      第三步:校验数据校验是否合法

      第四步:查看数据校验错误信息

    print(form_obj.errors)# 这个里面放的是所有校验未通过的字段及错误提示
    """
    {
    'name': ['Ensure this value has at most 6 characters (it has 7).'], 
    'password': ['Ensure this value has at least 3 characters (it has 2).'], 
    'email': ['Enter a valid email address.']
    }
    
    """

      第五步:查看校验通过的数据

    def reg(request):
        # 第二步:生成一个空对象
        form_obj = MyForm()
        if request.method == 'POST':
            # request.POST 是一个字典
            print(request.POST)
            # 对象中传参的格式也是字典
            form_obj = MyForm(request.POST)
            # 第三部,数据校验是否通过,少了不行,多的舍弃
            if form_obj.is_valid():
                # form_obj.cleaned_data,查看校验通过的的数据(字典形式)
                print(form_obj.cleaned_data)
                # 打散传值
                models.User.objects.create(**form_obj.cleaned_data)
        return render(request,'reg.html',locals())

       ps:

        1:form组件校验数据的规则是从上往下依次取值校验

        2:校验通过的被放到cleaned_data

        3:校验失败的放到errors

        4:form中所有的字段默认都是必须传值的(required=True)

        5:校验数据的时候可以都传(多传的数据不会做任何校验,也就是不会影响到form校验)

     

    四,form的小菜

      1,为input框里设置初始值:initial

    class LoginForm(forms.Form):
        username = forms.CharField(
            min_length=8,
            label="用户名",
            initial="张三"  # 设置默认值
        )
        pwd = forms.CharField(min_length=6, label="密码")

      2,重写错误信息:error_messages

    class LoginForm(forms.Form):
        username = forms.CharField(
            min_length=8,
            label="用户名",
            initial="张三",
            error_messages={
                "required": "不能为空",
                "invalid": "格式错误",
                "min_length": "用户名最短8位"
            }
        )

      3,设置标签样式

    from django import forms
    from django.forms import widgets
    class MyForm(forms.Form):
        name = forms.CharField(max_length=6,label='用户名',error_messages={
            'max_length':'用户名最长6位',
            'required':'用户名不能为空'
        })
        password = forms.CharField(max_length=8,min_length=3,error_messages={
            'max_length': '密码最长8位',
            'required': '密码不能为空',
            'min_length':'密码最少3位'
            # widget=widgets.PasswordInput():以密文形式输入
            # attrs = {'class': 'c1 form-control'}:设置bootstrap样式
        },widget=widgets.PasswordInput(attrs={'class':'c1 form-control'}))
        confirm_password = forms.CharField(max_length=8, min_length=3, error_messages={
            'max_length': '确认密码最长8位',
            'required': '确认密码不能为空',
            'min_length': '确认密码最少3位'
            # widget=widgets.PasswordInput():以密文形式输入
        },widget=widgets.PasswordInput())
        email = forms.EmailField(error_messages={
            'invalid':'邮箱格式不正确',
            'required':'邮箱不能为空'
        })
    
        gender = forms.ChoiceField(
            choices=((1, ""), (2, ""), (3, "保密")),
            label="性别",
            initial=3,  # 默认值
            # radio格式
            widget=forms.widgets.RadioSelect()
        )
    
        hobby = forms.ChoiceField(
            choices=((1, "篮球"), (2, "足球"), (3, "双色球"),),
            label="爱好",
            initial=3,
            # 单选格式
            widget=forms.widgets.Select()
        )
        hobby1 = forms.MultipleChoiceField(
            choices=((1, "篮球"), (2, "足球"), (3, "双色球"),),
            label="爱好",
            initial=[1, 3],
            widget=forms.widgets.SelectMultiple()
        )
    
        keep = forms.ChoiceField(
            label="是否记住密码",
            initial="checked",
            widget=forms.widgets.CheckboxInput()
        )

    四,钩子函数

      局部钩子函数:对单个布局字段增加限制条件:

    # 对name字段新增校验
    def clean_name(self):
        # 曲中name的值
        name = self.cleaned_data.get('name')
        if '666' in name:
            # 判断条件是否成立
            self.add_error('name','光喊666是不行的,要有真实力!')
        return name  # return还是要加上的,兼容性考虑

       全局钩子函数:对多个字段的校验利用全局钩子函数:

    # 全局钩子函数  (多个字段的校验利用全局钩子函数)
    def clean(self):
        password = self.cleaned_data.get('password')
        confirm_password = self.cleaned_data.get('confirm_password')
        if not password == confirm_password:
            self.add_error('confirm_password',"两次密码不一致,你这个dsb!")
        return self.cleaned_data

     

  • 相关阅读:
    AcceptEx与完成端口(IOCP)结合实例
    GMap.NET实现电子围栏功能(WPF版)
    十余年软件开发经历,经验总结和程序一览(涉及Socket、WPF、vc++、CAD、图像、GIS)
    AutoCAD 凸度(bulge)的概念及使用WPF函数画图
    WinForm版图像编辑小程序(实现图像拖动、缩放、旋转、抠图)
    使用GMap.NET类库,实现地图轨迹回放。(WPF版)
    使用 GMap.NET 实现添加标注、移动标注功能。(WPF版)
    关于组织召开 “2015中国职业经理人大会”的通知
    Windows平台下使用ffmpeg和segmenter实现m3u8直播点播
    【求职必备】知名互联网公司常见面试问题和应答策略--通用篇
  • 原文地址:https://www.cnblogs.com/ay742936292/p/11041476.html
Copyright © 2011-2022 走看看