zoukankan      html  css  js  c++  java
  • forms组件

    1 校验字段功能

    针对一个实例:注册用户讲解。

    模型:models.py

    class UserInfo(models.Model):
        name = models.CharField(max_length=32)
        pwd = models.CharField(max_length=32)
        email = models.EmailField()

    模板文件 

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    
    </head>
    <body>
    
    <form action="" method="post">
        {% csrf_token %}
        <div>
            <label for="user">用户名</label>
            <p><input type="text" name="name" id="user"></p>
        </div>
        <div>
            <label for="pwd">密码</label>
            <p><input type="password" name="pwd" id="pwd"></p>
        </div>
        <div>
            <label for="r_pwd">确认密码</label>
            <p><input type="password" name="r_pwd" id="r_pwd"></p>
        </div>
         <div>
            <label for="email">邮箱</label>
            <p><input type="text" name="email" id="email"></p>
        </div>
        <input type="submit">
    </form>
    
    </body>
    </html>

    视图函数:

    # forms组件
    from django.forms import widgets
    from django import forms
    
    class UserForm(forms.Form):
        name = forms.CharField(required=True, max_length=10, min_length=2, label='用户名',
                               error_messages=
                               {'required': '该字段必填', 'max_length': '太长了', 'min_length': '太短了'},
                               widget=widgets.TextInput(attrs={'class':'form-control error','aa':'xxx'})
                               )
        pwd = forms.CharField(max_length=10, min_length=2, label='密码',widget=widgets.PasswordInput(attrs={'class':'form-control error','aa':'xxx'}))
        r_pwd =forms.CharField(max_length=10, min_length=2, label='确认密码',widget=widgets.PasswordInput(attrs={'class':'form-control error','aa':'xxx'}))
        email = forms.EmailField(label='邮箱', error_messages={'required': '该字段必填', 'invalid': '不符合邮箱格式'},widget=widgets.EmailInput(attrs={'class':'form-control error','aa':'xxx'}))
        def register(request):
    
        if request.method=="POST":
            form=UserForm(request.POST)
            if form.is_valid():
                print(form.cleaned_data)       # 所有干净的字段以及对应的值
            else:
                print(form.cleaned_data)       #
                print(form.errors)             # ErrorDict : {"校验错误的字段":["错误信息",]}
                print(form.errors.get("name")) # ErrorList ["错误信息",]
            return HttpResponse("OK")
        form=UserForm()
        return render(request,"register.html",locals())

    2 渲染标签功能

    渲染方式1:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
       <!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
        <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css"+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
    </head>
    <body>
    <h3>注册页面</h3>
    <div class="container">
        <div class="row">
            <div class="col-md-6 col-lg-offset-3">
    
                    <form action="" method="post">
                        {% csrf_token %}
                        <div>
                            <label for="">用户名</label>
                            {{ form.name }}
                        </div>
                        <div>
                            <label for="">密码</label>
                            {{ form.pwd }}
                        </div>
                        <div>
                            <label for="">确认密码</label>
                            {{ form.r_pwd }}
                        </div>
                        <div>
                            <label for=""> 邮箱</label>
                            {{ form.email }}
                        </div>
    
                        <input type="submit" class="btn btn-default pull-right">
                    </form>
            </div>
        </div>
    </div>
    
    
    
    </body>
    </html>

    渲染方式2:

    <form action="" method="post">
                        {% csrf_token %}
                        
                        {% for field in form %}
                            <div>
                                <label for="">{{ field.label }}</label>
                                {{ field }}
                            </div>
                        {% endfor %}
                        <input type="submit" class="btn btn-default pull-right">
                    
    </form>

    渲染方式3:

    <form action="" method="post">
        {% csrf_token %}
        
        {{ form.as_p }}
    
        <input type="submit" class="btn btn-default pull-right">
    
    </form>

    3 渲染错误信息功能

    视图

    def register(request):
    
        if request.method=="POST":
            form=UserForm(request.POST)
            if form.is_valid():
                print(form.cleaned_data)       # 所有干净的字段以及对应的值
            else:
                print(form.cleaned_data)       #
                print(form.errors)             # ErrorDict : {"校验错误的字段":["错误信息",]}
                print(form.errors.get("name")) # ErrorList ["错误信息",]
            return render(request,"register.html",locals())
        form=UserForm()
        return render(request,"register.html",locals())
    

    模板

    <form action="" method="post" novalidate>
        {% csrf_token %}
        
        {% for field in form %}
            <div>
                <label for="">{{ field.label }}</label>
                {{ field }} <span class="pull-right" style="color: red">{{ field.errors.0 }}</span>
            </div>
        {% endfor %}
        <input type="submit" class="btn btn-default">
    
    </form>

    4 组件的参数配置

    class Ret(Form):
        name = forms.CharField(max_length=10, min_length=2, label='用户名',
                               error_messages={'required': '该字段不能为空', 'invalid': '格式错误', 'max_length': '太长',
                                               'min_length': '太短'},
                               widget=widgets.TextInput(attrs={'class':'form-control'}))
        pwd = forms.CharField(max_length=10, min_length=2, widget=widgets.PasswordInput(attrs={'class':'form-control'}))
        email = forms.EmailField(label='邮箱', error_messages={'required': '该字段不能为空', 'invalid': '格式错误'})

    5 局部钩子

    from django.core.exceptions import NON_FIELD_ERRORS, ValidationError
    def clean_name(self):
    
            val=self.cleaned_data.get("name")
    
            ret=UserInfo.objects.filter(name=val)
    
            if not ret:
                return val
            else:
                raise ValidationError("该用户已注册!")
    
        def clean_tel(self):
    
            val=self.cleaned_data.get("tel")
    
            if len(val)==11:
    
                return val
            else:
                raise  ValidationError("手机号格式错误")

    6 全局钩子

    def clean(self):
            pwd=self.cleaned_data.get('pwd')
            r_pwd=self.cleaned_data.get('r_pwd')
    
            if pwd and r_pwd:
                if pwd==r_pwd:
                    return self.cleaned_data
                else:
                    raise ValidationError('两次密码不一致')
            else:
    
                return self.cleaned_data
    from django import forms
    
    from django.forms import widgets
    from app01.models import UserInfo
    
    from django.core.exceptions import NON_FIELD_ERRORS, ValidationError
    
    class UserForm(forms.Form):
        name=forms.CharField(min_length=4,label="用户名",error_messages={"required":"该字段不能为空"},
                             widget=widgets.TextInput(attrs={"class":"form-control"})
                             )
        pwd=forms.CharField(min_length=4,label="密码",
                            widget=widgets.PasswordInput(attrs={"class":"form-control"})
                            )
        r_pwd=forms.CharField(min_length=4,label="确认密码",error_messages={"required":"该字段不能为空"},widget=widgets.TextInput(attrs={"class":"form-control"}))
        email=forms.EmailField(label="邮箱",error_messages={"required":"该字段不能为空","invalid":"格式错误"},widget=widgets.TextInput(attrs={"class":"form-control"}))
        tel=forms.CharField(label="手机号",widget=widgets.TextInput(attrs={"class":"form-control"}))
    
    
        def clean_name(self):
    
            val=self.cleaned_data.get("name")
    
            ret=UserInfo.objects.filter(name=val)
    
            if not ret:
                return val
            else:
                raise ValidationError("该用户已注册!")
    
        def clean_tel(self):
    
            val=self.cleaned_data.get("tel")
    
            if len(val)==11:
    
                return val
            else:
                raise  ValidationError("手机号格式错误")
    
        def clean(self):
            pwd=self.cleaned_data.get('pwd')
            r_pwd=self.cleaned_data.get('r_pwd')
    
            if pwd and r_pwd:
                if pwd==r_pwd:
                    return self.cleaned_data
                else:
                    raise ValidationError('两次密码不一致')
            else:
    
                return self.cleaned_data
    myforms
    from django.shortcuts import render,HttpResponse
    
    # Create your views here.
    
    
    
    
    
    from app01.myforms import *
    
    
    def reg(request):
    
        if request.method=="POST":
    
            print(request.POST)
    
            #form=UserForm({"name":"yu","email":"123@qq.com","xxxx":"alex"})
    
    
            form=UserForm(request.POST) # form表单的name属性值应该与forms组件字段名称一致
    
            print(form.is_valid()) # 返回布尔值
    
            if form.is_valid():
                print(form.cleaned_data)  # {"name":"yuan","email":"123@qq.com"}
            else:
                print(form.cleaned_data)  # {"email":"123@qq.com"}
                # print(form.errors)        # {"name":[".........."]}
                # print(type(form.errors))  # ErrorDict
                # print(form.errors.get("name"))
                # print(type(form.errors.get("name")))    # ErrorList
                # print(form.errors.get("name")[0])
    
    
                #   全局钩子错误
                #print("error",form.errors.get("__all__")[0])
                errors=form.errors.get("__all__")
    
    
                return render(request,"reg.html",locals())
    
            '''
    
            form.is_valid()   :返回布尔值
            form.cleaned_data :{"name":"yuan","email":"123@qq.com"}
            form.errors       :{"name":[".........."]}
    
            '''
    
    
        form=UserForm()
    
        return render(request,"reg.html",locals())
    视图函数
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <style>
            .error{
                color: red;
            }
        </style>
        <!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
        <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css"
        integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
    </head>
    <body>
    
    <div class="container">
    
        <div class="row">
            <div class="col-md-6 col-lg-offset-3">
    
                {#<h3>简单form</h3>#}
                {##}
                {##}
                {#<form action="" method="post" novalidate>#}
                {#    {% csrf_token %}#}
                {#    <p>用户名<input type="text" name="name"></p>#}
                {#    <p>密码 <input type="text" name="pwd"></p>#}
                {#    <p>确认密码 <input type="text" name="r_pwd"></p>#}
                {#    <p>邮箱  <input type="text" name="email"></p>#}
                {#    <p>手机号 <input type="text" name="tel"></p>#}
                {#    <input type="submit">#}
                {##}
                {#</form>#}
    
                <hr>
                <h3>forms组件渲染方式1</h3>
                <form action="" method="post" novalidate>
    
                    {% csrf_token %}
                    <p>{{ form.name.label }}
                        {{ form.name }} <span class="pull-right error">{{ form.name.errors.0 }}</span>
                    </p>
                    <p>{{ form.pwd.label }}
                        {{ form.pwd }} <span class="pull-right error">{{ form.pwd.errors.0 }}</span>
                    </p>
                    <p>确认密码
                        {{ form.r_pwd }} <span class="pull-right error">{{ form.r_pwd.errors.0 }}</span><span class="pull-right error">{{ errors.0 }}</span>
                    </p>
                    <p>邮箱 {{ form.email }} <span class="pull-right error">{{ form.email.errors.0 }}</span></p>
                    <p>手机号 {{ form.tel }} <span class="pull-right error">{{ form.tel.errors.0 }}</span></p>
                    <input type="submit">
    
                </form>
    
                {#<h3>forms组件渲染方式2</h3>#}
                {##}
                {#<form action="" method="post" novalidate>#}
                {#     {% csrf_token %}#}
                {##}
                {#    {% for field in form %}#}
                {##}
                {#        <div>#}
                {#            <label for="">{{ field.label }}</label>#}
                {#            {{ field }}#}
                {#        </div>#}
                {##}
                {#    {% endfor %}#}
                {##}
                {#     <input type="submit">#}
                {#</form>#}
                {##}
                {#<h3>forms组件渲染方式3</h3>#}
                {##}
                {#<form action="" method="post">#}
                {#     {% csrf_token %}#}
                {##}
                {#     {{ form.as_p }}#}
                {##}
                {#     <input type="submit">#}
                {#</form>#}
    
    
            </div>
        </div>
    </div>
    
    </body>
    </html>
    模板文件
  • 相关阅读:
    hdu 4027 Can you answer these queries? 线段树
    ZOJ1610 Count the Colors 线段树
    poj 2528 Mayor's posters 离散化 线段树
    hdu 1599 find the mincost route floyd求最小环
    POJ 2686 Traveling by Stagecoach 状压DP
    POJ 1990 MooFest 树状数组
    POJ 2955 Brackets 区间DP
    lightoj 1422 Halloween Costumes 区间DP
    模板 有源汇上下界最小流 loj117
    模板 有源汇上下界最大流 loj116
  • 原文地址:https://www.cnblogs.com/chen464863847/p/9656419.html
Copyright © 2011-2022 走看看