Django中form组件的三大特点:

1. 生成页面可使用的HTML标签

           2. 对用户提交的数据进行初步校验

             3. 保留上次输入内容

废话不多说,直接进入正题。

这是注册界面截图:

与上一篇ajax不同的是,ajax是输入光标移动后,就提交到后台验证;而form组件则是需要点击注册后,才会在前端校验。

代码(views.py): (注释部分是常用到的一下组件的方法,都有比较详细的注释,大家可以自行研究)

from django.shortcuts import render, HttpResponse
from app01 import models
# 导入forms组件
from django import forms
from django.forms import widgets
from django.core.validators import RegexValidator
# Create your views here. class RegForms(forms.Form):
name = forms.CharField(
label="帐号",
max_length=16,
# 自定义类的属性
widget=widgets.TextInput(attrs={"class": "form-control"}),
error_messages={
"required": "帐号不能为空"
}
)
# 调用form组件内部方法创建一个长度不大于16且不小于8的密码文本框
pwd = forms.CharField(
label="密码",
max_length=16,
min_length=8,
# 定义为密码文本,render_value设置为验证不通过时不把密码刷新掉
widget=widgets.PasswordInput(attrs={"class": "form-control"}, render_value=True),
error_messages={
"min_length": "密码不能少于8位数",
"required": "密码不能为空"
}
) re_pwd = forms.CharField(
label="确认密码",
max_length=16,
min_length=8,
# 定义为密码文本,render_value设置为验证不通过时不把密码刷新掉
widget=widgets.PasswordInput(attrs={"class": "form-control"}, render_value=True),
error_messages={
"min_length": "密码不能少于8位数",
"required": "密码不能为空"
}
)
email = forms.EmailField(
label="邮箱",
widget=widgets.EmailInput(attrs={"class": "form-control"}),
error_messages={
"required": "邮箱地址不能为空",
# invalid 是校验格式是否正确
"invalid": "邮箱地址格式错误",
}
)
mobliphone = forms.CharField(
label="手机",
widget=widgets.TextInput(attrs={"class": "form-control"}),
# form 组件中用正则判断是否符合条件
validators=[RegexValidator(r'^[0-9]+$', '请输入数字'), RegexValidator(r'^159[0-9]+$', '数字必须以159开头')],
error_messages={
"required": "手机号码不能为空",
}
) # # 单radio值为字符串
# gender = forms.fields.ChoiceField(
# choices=((1, "男"), (2, "女"), (3, "保密")),
# label="性别",
# initial=3,
# widget=forms.widgets.RadioSelect()
# ) # # 单选Select
# hobby = forms.fields.ChoiceField(
# choices=((1, "篮球"), (2, "足球"), (3, "双色球"),),
# label="爱好",
# initial=3,
# widget=forms.widgets.Select()
# ) # # 多选Select
# hobby = forms.fields.MultipleChoiceField(
# choices=((1, "篮球"), (2, "足球"), (3, "双色球"),),
# label="爱好",
# initial=[1, 3],
# widget=forms.widgets.SelectMultiple()
# ) # # 单选checkbox
# keep = forms.fields.ChoiceField(
# label="记住密码",
# initial="checked",
# widget=forms.widgets.CheckboxInput()
# ) # # 多选checkbox
# hobby = forms.fields.MultipleChoiceField(
# choices=((1, "篮球"), (2, "足球"), (3, "双色球"),),
# label="爱好",
# initial=[1, 3],
# widget=forms.widgets.CheckboxSelectMultiple()
# ) # 注册
def register(request):
# 实例化对象类
form_obj = RegForms()
if request.method == 'POST':
# 实例化form对象的同时传入从网页通过post方式提交过来的参数
form_obj = RegForms(request.POST)
# 调用form_obj校验数据的方法
if form_obj.is_valid():
# return HttpResponse("注册成功!")
# print(form_obj.cleaned_data)
# 去除字典中的re_pwd项
del form_obj.cleaned_data["re_pwd"]
# print(form_obj.cleaned_data)
models.Tset01.objects.create(**form_obj.cleaned_data)
return HttpResponse("注册成功!") return render(request, "register.html", {"form_obj": form_obj}) 代码(HTML):
<form action="/register/" method="post" novalidate>
{% csrf_token %}
{# 下面的if语句是用来判断是否有错误 #}
<div class="form-group {% if form_obj.name.errors.0 %} has-error {% endif %}">
{# 相当于注册截图中的“帐号”(下同)#}
{{ form_obj.name.label }}
{# 相当于注册截图中的文本框 (下同)#}
{{ form_obj.name }}
<span class="help-block">{{ form_obj.name.errors.0 }}</span>
</div>
    <div class="form-group  {% if form_obj.pwd.errors.0 %} has-error {% endif %}">
{{ form_obj.pwd.label }}
{{ form_obj.pwd }}
<span class="help-block">{{ form_obj.pwd.errors.0 }}</span>
</div>
<div class="form-group {% if form_obj.re_pwd.errors.0 %} has-error {% endif %}">
{{ form_obj.re_pwd.label }}
{{ form_obj.re_pwd }}
<span class="help-block">{{ form_obj.re_pwd.errors.0 }}</span>
</div>
<div class="form-group {% if form_obj.email.errors.0 %} has-error {% endif %}">
{{ form_obj.email.label }}
{{ form_obj.email }}
<span class="help-block">{{ form_obj.email.errors.0 }}</span>
</div>
<div class="form-group {% if form_obj.mobliphone.errors.0 %} has-error {% endif %}">
{{ form_obj.mobliphone.label }}
{{ form_obj.mobliphone }}
<span class="help-block">{{ form_obj.mobliphone.errors.0 }}</span>
</div>
<div class="form-group">
<input type="submit" class="btn btn-success" value="注册">
</div>
注释得明明白白的,有不懂的可以一起探讨,共同进步!

django框架中form组件的简单使用示例:注册验证的更多相关文章

  1. Django框架11 /form组件、modelForm组件

    Django框架11 /form组件.modelForm组件 目录 Django框架11 /form组件.modelForm组件 1. form组件介绍 2. form常用字段与插件 3. form所 ...

  2. Django框架 之 form组件的钩子

    Django框架 之 form组件的钩子 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 3 ...

  3. Django框架 之 form组件

    Django框架 之 form组件 浏览目录 Form介绍 普通的登录 使用form组件 Form详情 常用字段 校验 进阶 使用Django Form流程 一.Form介绍 我们之前在HTML页面中 ...

  4. django框架进阶-form组件-长期维护

    ##################     form组件做了什么事情?      ####################### 之前web开发的模式,以注册为例 1,要有一个注册页面,然后有一个f ...

  5. Django框架之Form组件

    一.初探Form组件 在介绍Form组件之前,让大家先看看它强大的功能吧!Go... 下面我们来看看代码吧! 1.创建Form类 from django.forms import Form from ...

  6. Django 框架之Form组件

    1. Django的Form主要具有以下几大功能: 生成HTML标签 验证用户数据(显示错误信息) HTML Form提交保留上次提交的数据 初始化页面显示内容 2. 第一个案例: # 第一步: 创建 ...

  7. Django框架【form组件】

    from django.shortcuts import render,redirect # Create your views here. from .models import * from dj ...

  8. django框架中form表单Post方法无法提交 Forbidden (403) CSRF verification failed. Request aborted.

    问题如图: 解决方法: 在视图函数中引入并使用装饰器 from django.views.decorators.csrf import csrf_exempt @csrf_exempt

  9. python3开发进阶-Django框架中form的查看校验方法is_valid()的源码,自定义验证方法

    form表单的校验方法is_valid() 点开我们发现这个函数里面只有两个方法方法,最终返回True or False 我们点进.is_bound属性,里面判断传输的数据不是空和上传文件不是空 点进 ...

随机推荐

  1. Linux下“/”和“~”的区别

    在linux中,”/“代表根目录,”~“是代表目录.Linux存储是以挂载的方式,相当于是树状的,源头就是”/“,也就是根目录. 而每个用户都有”家“目录,也就是用户的个人目录,比如root用户的”家 ...

  2. BASE64加解密

    - JDK 自带 - Commons Codec  地址:http://commons.apache.org/proper/commons-codec/download_codec.cgi - Bou ...

  3. 从svn到git开发转变

    前言:目前的公司的开发技术还是处于刀耕火种的年代,react,vue已经火到不行了,可是还在用jQuery一遍遍处理着dom.版本控制用的是svn,这里也不是说svn不好,在windows下svn的“ ...

  4. Hash索引和BTree索引区别【转】

    索引是帮助mysql获取数据的数据结构.最常见的索引是Btree索引和Hash索引. 不同的引擎对于索引有不同的支持:Innodb和MyISAM默认的索引是Btree索引:而Mermory默认的索引是 ...

  5. 【云短信】腾讯&阿里

    腾讯 : https://github.com/qcloudsms/qcloudsms_csharp 安装nuget包: using qcloudsms_csharp; using System.Co ...

  6. leecode第五百五十七题(反转字符串中的单词 III)

    class Solution { public: string reverseWords(string s) { string res; stack<char> sta; string:: ...

  7. python之做一个简易的翻译器(一)

    平时经常在网上翻译一些单词,突发奇想,可不可以直接调某些免费翻译网站的接口呢?然后做一个图形界面的翻译小工具?下面开始实践 1.先找一下有哪些免费翻译的接口 百度了一下关键字“免费翻译接口”,然后找到 ...

  8. python 【pandas】账号、银行卡号、身份证号导出文件后以科学计数法显示问题解决

    问题描述:excel表中的一些数据会以文本格式格式保存,例如一些较长的编号.银行账号.身份证号等,再python中导出文件后,会发现数据以科学计数法显示,影响后续使用. data2_3.to_exce ...

  9. JSP介绍

    1.JSP简介 JSP全名为Java Server Pages,中文名叫java服务器页面,其根本是一个简化的Servlet设计,它是由Sun Microsystems公司倡导.许多公司参与一起建立的 ...

  10. Vue 组件异步加载(懒加载)

    一.vue的编译模式 (1)路由配置信息 //eg1: const MSite = resolve => require.ensure([], () =>resolve(require([ ...