HTML的form表单和django的form表单


Posted in Python onJuly 25, 2019

django的表单系统,分2种

  • 基于django.forms.Form的所有表单类的父类
  • 基于django.forms.ModelForm,可以和模型类绑定的Form

直接用原生的form表单,也可以直接用,较麻烦,

django的form表单,也可用可不要,

在views里创建一个类,继承了forms.Form ,每个字段就是一个输入框,

#-----
#django 的form表单

from django import forms

class MyForm(forms.Form):
  #forms对应的是前端的form表单,form 表单要验证的字段
  #都与校验有关系,与数据库没有关系

  #封装性强,可以 在前端指定显示那些字段,label 是显示指定的数据,
  user = forms.CharField(label="用户名")#输入的用户名,
  age = forms.IntegerField(label="年龄")
  email = forms.EmailField()


#form注册

def reg2(request):
  # 实列化出一个form对象,传到前端

  form_obj = MyForm()

  return render(request,"reg2.html",{"form_obj":form_obj})

在前端新建一个注册页面,前端渲染表单,是后端表单类实例出来的对象,用对象调用每个字段,

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>

</head>
<body>

<h3>form表单使用</h3>
<form action="/reg2/" method="post">
{#  渲染从后端传来的变量,as_p 是段落#}
  {% csrf_token %}
{#  {{ form_obj.as_p }}#}
  <p>姓名{{ form_obj.user }}</p>
  <p>年龄{{ form_obj.age }}</p>
  <p>邮箱{{ form_obj.email }}</p>

</form>

</body>

</html>

可以从浏览器的检查元素中看到,浏览器自动添加了一些东西,

<body>

<h3>form表单使用</h3>
<form action="/reg2/" method="post">

  <input name="csrfmiddlewaretoken" value="GyY3KE5uM7HeErOEZ8OQFwUJYQYaknrOmavdmfufBuVOHdDSWfeHDyt2pjXarGAV" type="hidden">

  <p>姓名<input name="user" required="" id="id_user" type="text"></p>
  <p>年龄<input name="age" required="" id="id_age" type="number"></p>
  <p>邮箱<input name="email" required="" id="id_email" type="email"></p>

</form>
</body>

如果在前端页面随便输入就提交,前端会做校验,这都是浏览器做的校验,

HTML的form表单和django的form表单

可以自己定制,字段的错误信息提示,和显示信息,

#django 的form表单
 
from django import forms
 
class MyForm(forms.Form):
  #forms对应的是前端的form表单,form 表单要验证的字段
  #都与校验有关系,与数据库没有关系
 
  #封装性强,可以 在前端指定显示那些字段,label 是显示指定的数据,require 是必须填写的,
  user = forms.CharField(label="用户名",min_length=5,max_length=8)#输入的用户名,
  age = forms.IntegerField(label="年龄",error_messages={"required":"必填",})
  email = forms.EmailField()
 
 
#form注册
 
def reg2(request):
 
  errors_obj = " "
  if request.method == "POST":
    form_post = MyForm(request.POST)#拿到请求的所有数据
    if form_post.is_valid():#判断数据是否合法,返回布尔值,
 
      print("data",form_post.cleaned_data)#获取数据,得到一个字典格式,
 
    #添加数据库
    # User.objects.create_user()
  # 实列化出一个form对象,传到前端
 
    #如果是输入不合格式的信息,错误信息,
    else:
      #获取错误信息
      errors_obj = form_post.errors
 
      # print("error",form_post.errors["user"][0])
      # print("error",form_post.errors["age"])
      # print("error",type(form_post.errors))#字典类型,
 
 
  form_obj = MyForm()
 
  return render(request,"reg2.html",{"form_obj":form_obj,"errors_obj":errors_obj})

在前端页面

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>

</head>
<body>

<h3>form表单使用</h3>
<form action="/reg2/" method="post">
{#  渲染从后端传来的变量,as_p 是段落#}
  {% csrf_token %}
{#  {{ form_obj.as_p }}#}
  <p>姓名{{ form_obj.user }} <span>{{ errors.obj.user.0 }}</span> </p>
  <p>年龄{{ form_obj.age }}<span>{{ errors.obj.age.0 }}</span></p>
  <p>邮箱{{ form_obj.email }}<span>{{ errors.obj.email.0 }}</span></p>
  <input type="submit">

</form>

</body>

</html>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Python 相关文章推荐
python概率计算器实例分析
Mar 25 Python
python模块之StringIO使用示例
Apr 08 Python
python根据日期返回星期几的方法
Jul 06 Python
简单了解什么是神经网络
Dec 23 Python
Python设计模式之代理模式简单示例
Jan 09 Python
tensorflow1.0学习之模型的保存与恢复(Saver)
Apr 23 Python
django模型动态修改参数,增加 filter 字段的方式
Mar 16 Python
关于python3.9安装wordcloud出错的问题及解决办法
Nov 02 Python
python3爬虫中多线程的优势总结
Nov 24 Python
python爬虫爬取某网站视频的示例代码
Feb 20 Python
python代码实现备忘录案例讲解
Jul 26 Python
python DataFrame中stack()方法、unstack()方法和pivot()方法浅析
Apr 06 Python
Python3 批量扫描端口的例子
Jul 25 #Python
python3 批量获取对应端口服务的实例
Jul 25 #Python
Python实现微信小程序支付功能
Jul 25 #Python
Form表单及django的form表单的补充
Jul 25 #Python
python实现切割url得到域名、协议、主机名等各个字段的例子
Jul 25 #Python
python按修改时间顺序排列文件的实例代码
Jul 25 #Python
在python中用url_for构造URL的方法
Jul 25 #Python
You might like
php数组相加 array(“a”)+array(“b”)结果还是array(“a”)
2012/09/19 PHP
利用phpExcel实现Excel数据的导入导出(全步骤详细解析)
2013/11/26 PHP
php自动加载autoload机制示例分享
2014/02/20 PHP
PHP调用JAVA的WebService简单实例
2014/03/11 PHP
PHP实现抓取Google IP并自动修改hosts文件
2015/02/12 PHP
如何使用纯PHP实现定时器任务(Timer)
2015/07/31 PHP
php注册和登录界面的实现案例(推荐)
2016/10/24 PHP
PHP autoload使用方法及步骤详解
2020/09/05 PHP
jQuery之网页换肤实现代码
2011/04/30 Javascript
使用jQuery实现返回顶部
2015/01/26 Javascript
javascript实现动态表头及表列的展现方法
2015/07/14 Javascript
在AngularJS中使用jQuery的zTree插件的方法
2016/04/21 Javascript
JS实现图片延迟加载并淡入淡出效果的简单方法
2016/08/25 Javascript
JS实现类似51job上的地区选择效果示例
2016/11/17 Javascript
Vue.js实现多条件筛选、搜索、排序及分页的表格功能
2020/11/24 Javascript
JavaScript数据结构与算法之队列原理与用法实例详解
2017/11/22 Javascript
vue form 表单提交后刷新页面的方法
2018/09/04 Javascript
angularjs下ng-repeat点击元素改变样式的实现方法
2018/09/12 Javascript
layui 选择列表,打勾,点击确定返回数据的例子
2019/09/02 Javascript
使用vue打包进行云服务器上传的问题
2020/03/02 Javascript
vue-cli4使用全局less文件中的变量配置操作
2020/10/21 Javascript
[03:08]TI9战队档案 - Vici Gaming
2019/08/20 DOTA
python使用calendar输出指定年份全年日历的方法
2015/04/04 Python
详解Django中的form库的使用
2015/07/18 Python
简述Python中的进程、线程、协程
2016/03/18 Python
局域网内python socket实现windows与linux间的消息传送
2019/04/19 Python
使用PyQt的QLabel组件实现选定目标框功能的方法示例
2020/05/19 Python
使用CSS3的背景渐变Text Gradient 创建文字颜色渐变
2014/08/19 HTML / CSS
css3遮罩层镂空效果的多种实现方法
2020/05/11 HTML / CSS
HTML5探秘:用requestAnimationFrame优化Web动画
2018/06/03 HTML / CSS
HTML5之WebGL 3D概述(下)—借助类库开发及框架介绍
2013/01/31 HTML / CSS
《自然之道》教学反思
2014/02/11 职场文书
警察群众路线对照检查材料思想汇报
2014/10/01 职场文书
教师廉洁自律个人总结
2015/02/10 职场文书
提档介绍信范文
2015/10/22 职场文书
品德与社会教学反思
2016/02/24 职场文书