• Django高级之-forms组件

    Django高级之-forms组件

    1 校验字段功能

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

    模型：models.py

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

    模版文件

    1. <!DOCTYPE html>
    2. <html lang="en">
    3. <head>
    4.     <meta charset="UTF-8">
    5.     <title>Title</title>
    6.  
    7. </head>
    8. <body>
    9.  
    10. <form action="" method="post">
    11.     {% csrf_token %}
    12.     <div>
    13.         <label for="user">用户名</label>
    14.         <p><input type="text" name="name" id="name"></p>
    15.     </div>
    16.     <div>
    17.         <label for="pwd">密码</label>
    18.         <p><input type="password" name="pwd" id="pwd"></p>
    19.     </div>
    20.     <div>
    21.         <label for="r_pwd">确认密码</label>
    22.         <p><input type="password" name="r_pwd" id="r_pwd"></p>
    23.     </div>
    24.      <div>
    25.         <label for="email">邮箱</label>
    26.         <p><input type="text" name="email" id="email"></p>
    27.     </div>
    28.     <input type="submit">
    29. </form>
    30.  
    31. </body>
    32. </html>

    视图函数：

    1. # forms组件
    2. from django.forms import widgets
    3.  
    4. wid_01=widgets.TextInput(attrs={"class":"form-control"})
    5. wid_02=widgets.PasswordInput(attrs={"class":"form-control"})
    6.  
    7. class UserForm(forms.Form):
    8.     name=forms.CharField(max_length=32,
    9.                          widget=wid_01
    10.                          )
    11.     pwd=forms.CharField(max_length=32,widget=wid_02)
    12.     r_pwd=forms.CharField(max_length=32,widget=wid_02)
    13.     email=forms.EmailField(widget=wid_01)
    14.     tel=forms.CharField(max_length=32,widget=wid_01)
    15.  
    16.  
    17.  
    18. def register(request):
    19.  
    20.     if request.method=="POST":
    21.         form=UserForm(request.POST)
    22.         if form.is_valid():
    23.             print(form.cleaned_data)       # 所有干净的字段以及对应的值
    24.         else:
    25.             print(form.cleaned_data)       #
    26.             print(form.errors)             # ErrorDict : {"校验错误的字段":["错误信息",]}
    27.             print(form.errors.get("name")) # ErrorList ["错误信息",]
    28.         return HttpResponse("OK")
    29.     form=UserForm()
    30.     return render(request,"register.html",locals())

    2 渲染标签功能

    渲染方式1

    1. <!DOCTYPE html>
    2. <html lang="en">
    3. <head>
    4.     <meta charset="UTF-8">
    5.     <title>Title</title>
    6.    <!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
    7.     <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
    8. </head>
    9. <body>
    10. <h3>注册页面</h3>
    11. <div class="container">
    12.     <div class="row">
    13.         <div class="col-md-6 col-lg-offset-3">
    14.  
    15.                 <form action="" method="post">
    16.                     {% csrf_token %}
    17.                     <div>
    18.                         <label for="">用户名</label>
    19.                         {{ form.name }}
    20.                     </div>
    21.                     <div>
    22.                         <label for="">密码</label>
    23.                         {{ form.pwd }}
    24.                     </div>
    25.                     <div>
    26.                         <label for="">确认密码</label>
    27.                         {{ form.r_pwd }}
    28.                     </div>
    29.                     <div>
    30.                         <label for=""> 邮箱</label>
    31.                         {{ form.email }}
    32.                     </div>
    33.  
    34.                     <input type="submit" class="btn btn-default pull-right">
    35.                 </form>
    36.         </div>
    37.     </div>
    38. </div>
    39.  
    40.  
    41.  
    42. </body>
    43. </html>

    渲染方式2

    1. <form action="" method="post">
    2.                     {% csrf_token %}
    3.                     
    4.                     {% for field in form %}
    5.                         <div>
    6.                             <label for="">{{ field.label }}</label>
    7.                             {{ field }}
    8.                         </div>
    9.                     {% endfor %}
    10.                     <input type="submit" class="btn btn-default pull-right">
    11.                 
    12. </form>

    渲染方式3

    1. <form action="" method="post">
    2.     {% csrf_token %}
    3.     
    4.     {{ form.as_p }}
    5.  
    6.     <input type="submit" class="btn btn-default pull-right">
    7.  
    8. </form>

    3 渲染错误信息功能

    视图

    1. def register(request):
    2.  
    3.     if request.method=="POST":
    4.         form=UserForm(request.POST)
    5.         if form.is_valid():
    6.             print(form.cleaned_data)       # 所有干净的字段以及对应的值
    7.         else:
    8.             print(form.cleaned_data)       #
    9.             print(form.errors)             # ErrorDict : {"校验错误的字段":["错误信息",]}
    10.             print(form.errors.get("name")) # ErrorList ["错误信息",]
    11.         return render(request,"register.html",locals())
    12.     form=UserForm()
    13.     return render(request,"register.html",locals())

    模板

    1. <form action="" method="post" novalidate>
    2.     {% csrf_token %}
    3.     
    4.     {% for field in form %}
    5.         <div>
    6.             <label for="">{{ field.label }}</label>
    7.             {{ field }} <span class="pull-right" style="color: red">{{ field.errors.0 }}</span>
    8.         </div>
    9.     {% endfor %}
    10.     <input type="submit" class="btn btn-default">
    11.  
    12. </form>

    4 组件的参数配置

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

    5 局部钩子

    1. from django.core.exceptions import NON_FIELD_ERRORS, ValidationError
    2. def clean_name(self):
    3.  
    4.         val=self.cleaned_data.get("name")
    5.  
    6.         ret=UserInfo.objects.filter(name=val)
    7.  
    8.         if not ret:
    9.             return val
    10.         else:
    11.             raise ValidationError("该用户已注册!")
    12.  
    13.     def clean_tel(self):
    14.  
    15.         val=self.cleaned_data.get("tel")
    16.  
    17.         if len(val)==11:
    18.  
    19.             return val
    20.         else:
    21.             raise  ValidationError("手机号格式错误")

    6 全局钩子

    1. def clean(self):
    2.     pwd=self.cleaned_data.get('pwd')
    3.     r_pwd=self.cleaned_data.get('r_pwd')
    4.  
    5.     if pwd and r_pwd:
    6.         if pwd==r_pwd:
    7.             return self.cleaned_data
    8.         else:
    9.             raise ValidationError('两次密码不一致')
    10.     else:
    11.  
    12.         return self.cleaned_data
    13. pwd_err=my_form.errors.get('__all__')
    14. from django import forms
    15.  
    16. from django.forms import widgets
    17. from app01.models import UserInfo
    18.  
    19. from django.core.exceptions import NON_FIELD_ERRORS, ValidationError
    20.  
    21. class UserForm(forms.Form):
    22.     name=forms.CharField(min_length=4,label="用户名",error_messages={"required":"该字段不能为空"},
    23.                          widget=widgets.TextInput(attrs={"class":"form-control"})
    24.                          )
    25.     pwd=forms.CharField(min_length=4,label="密码",
    26.                         widget=widgets.PasswordInput(attrs={"class":"form-control"})
    27.                         )
    28.     r_pwd=forms.CharField(min_length=4,label="确认密码",error_messages={"required":"该字段不能为空"},widget=widgets.TextInput(attrs={"class":"form-control"}))
    29.     email=forms.EmailField(label="邮箱",error_messages={"required":"该字段不能为空","invalid":"格式错误"},widget=widgets.TextInput(attrs={"class":"form-control"}))
    30.     tel=forms.CharField(label="手机号",widget=widgets.TextInput(attrs={"class":"form-control"}))
    31.  
    32.  
    33.     def clean_name(self):
    34.  
    35.         val=self.cleaned_data.get("name")
    36.  
    37.         ret=UserInfo.objects.filter(name=val)
    38.  
    39.         if not ret:
    40.             return val
    41.         else:
    42.             raise ValidationError("该用户已注册!")
    43.  
    44.     def clean_tel(self):
    45.  
    46.         val=self.cleaned_data.get("tel")
    47.  
    48.         if len(val)==11:
    49.  
    50.             return val
    51.         else:
    52.             raise  ValidationError("手机号格式错误")
    53.  
    54.     def clean(self):
    55.         pwd=self.cleaned_data.get('pwd')
    56.         r_pwd=self.cleaned_data.get('r_pwd')
    57.  
    58.         if pwd and r_pwd:
    59.             if pwd==r_pwd:
    60.                 return self.cleaned_data
    61.             else:
    62.                 raise ValidationError('两次密码不一致')
    63.         else:
    64.  
    65.             return self.cleaned_data
    66. from django.shortcuts import render,HttpResponse
    67.  
    68. from app01.myforms import *
    69.  
    70. def reg(request):
    71.  
    72.     if request.method=="POST":
    73.  
    74.         print(request.POST)
    75.  
    76.         #form=UserForm({"name":"yu","email":"123@qq.com","xxxx":"alex"})
    77.  
    78.  
    79.         form=UserForm(request.POST) # form表单的name属性值应该与forms组件字段名称一致
    80.  
    81.         print(form.is_valid()) # 返回布尔值
    82.  
    83.         if form.is_valid():
    84.             print(form.cleaned_data)  # {"name":"yuan","email":"123@qq.com"}
    85.         else:
    86.             print(form.cleaned_data)  # {"email":"123@qq.com"}
    87.             # print(form.errors)        # {"name":[".........."]}
    88.             # print(type(form.errors))  # ErrorDict
    89.             # print(form.errors.get("name"))
    90.             # print(type(form.errors.get("name")))    # ErrorList
    91.             # print(form.errors.get("name")[0])
    92.  
    93.  
    94.             #   全局钩子错误
    95.             #print("error",form.errors.get("__all__")[0])
    96.             errors=form.errors.get("__all__")
    97.  
    98.  
    99.             return render(request,"reg.html",locals())
    100.  
    101.         '''
    103.         form.is_valid()   :返回布尔值
    104.         form.cleaned_data :{"name":"yuan","email":"123@qq.com"}
    105.         form.errors       :{"name":[".........."]}
    107.         '''
    108.  
    109.  
    110.     form=UserForm()
    111.  
    112.     return render(request,"reg.html",locals())
    113. <!DOCTYPE html>
    114. <html lang="en">
    115. <head>
    116.     <meta charset="UTF-8">
    117.     <title>Title</title>
    118.     <style>
    119.         .error{
    120.             color: red;
    121.         }
    122.     </style>
    123.     <!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
    124.     <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css"
    125.     integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
    126. </head>
    127. <body>
    128.  
    129. <div class="container">
    130.  
    131.     <div class="row">
    132.         <div class="col-md-6 col-lg-offset-3">
    133.  
    134.             {#<h3>简单form</h3>#}
    135.             {##}
    136.             {##}
    137.             {#<form action="" method="post" novalidate>#}
    138.             {#    {% csrf_token %}#}
    139.             {#    <p>用户名<input type="text" name="name"></p>#}
    140.             {#    <p>密码 <input type="text" name="pwd"></p>#}
    141.             {#    <p>确认密码 <input type="text" name="r_pwd"></p>#}
    142.             {#    <p>邮箱  <input type="text" name="email"></p>#}
    143.             {#    <p>手机号 <input type="text" name="tel"></p>#}
    144.             {#    <input type="submit">#}
    145.             {##}
    146.             {#</form>#}
    147.  
    148.             <hr>
    149.             <h3>forms组件渲染方式1</h3>
    150.             <form action="" method="post" novalidate>
    151.  
    152.                 {% csrf_token %}
    153.                 <p>{{ form.name.label }}
    154.                     {{ form.name }} <span class="pull-right error">{{ form.name.errors.0 }}</span>
    155.                 </p>
    156.                 <p>{{ form.pwd.label }}
    157.                     {{ form.pwd }} <span class="pull-right error">{{ form.pwd.errors.0 }}</span>
    158.                 </p>
    159.                 <p>确认密码
    160.                     {{ form.r_pwd }} <span class="pull-right error">{{ form.r_pwd.errors.0 }}</span><span class="pull-right error">{{ errors.0 }}</span>
    161.                 </p>
    162.                 <p>邮箱 {{ form.email }} <span class="pull-right error">{{ form.email.errors.0 }}</span></p>
    163.                 <p>手机号 {{ form.tel }} <span class="pull-right error">{{ form.tel.errors.0 }}</span></p>
    164.                 <input type="submit">
    165.  
    166.             </form>
    167.  
    168.             {#<h3>forms组件渲染方式2</h3>#}
    169.             {##}
    170.             {#<form action="" method="post" novalidate>#}
    171.             {#     {% csrf_token %}#}
    172.             {##}
    173.             {#    {% for field in form %}#}
    174.             {##}
    175.             {#        <div>#}
    176.             {#            <label for="">{{ field.label }}</label>#}
    177.             {#            {{ field }}#}
    178.             {#        </div>#}
    179.             {##}
    180.             {#    {% endfor %}#}
    181.             {##}
    182.             {#     <input type="submit">#}
    183.             {#</form>#}
    184.             {##}
    185.             {#<h3>forms组件渲染方式3</h3>#}
    186.             {##}
    187.             {#<form action="" method="post">#}
    188.             {#     {% csrf_token %}#}
    189.             {##}
    190.             {#     {{ form.as_p }}#}
    191.             {##}
    192.             {#     <input type="submit">#}
    193.             {#</form>#}
    194.  
    195.  
    196.         </div>
    197.     </div>
    198. </div>
    199.  
    200. </body>
    201. </html>

             

  • 相关阅读:
    网络-跨域解决
    leetcode/复原 IP
    关于对 DeferWindowPos 的理解
    setContentView源码解析
    Visual Studio Code 常用快捷键大全
    根据输入类型来选择函数不同的实现方法functools.singledispatch
    前端自学需要把大量时间放在 HTML、CSS 吗？
    Django（1）概述
    Python Qt UI设计
    src与href的区别？
  • 原文地址：https://blog.csdn.net/Renweif/article/details/136546030