xi123的个人博客分享 http://blog.sciencenet.cn/u/xi123

博文

django之表单处理

已有 2583 次阅读 2018-1-14 12:12 |个人分类:django学习|系统分类:科研笔记

一、HTML表单

   表单用于从客户端收集用户在浏览器中的输入,是HTML实现客服端与服务器交互的核心方法。作为连接客服端与服务器的纽带,表单也是python中web框架编程都要用到的技术。HTML表单用<form>标签表达,其内容有输入控件和提交组件组成,表单的基本工作方式如下:

   1、用户在浏览器中输入数据并提交,输入数据可以是文本、单选、多选等;

   2、浏览器将输入的数据封装到HTTP body中并以POST或GET的方式提交给服务器;

   3、服务器收到请求后将结果Response给浏览器;

   用户在浏览器中输入数据的形式有:

   (1)文本输入:

       单行文本<input type='text'>

       多行文本<textarea>

       密码框<input type="password">

       需要给每个输入控件设置一个不同的【name】属性,该属性用于在表单被提交到服务器后,使服务器识别各个输入控件。还可以通过设置rows和cols属性控制输入框的大小。

   (2)单向选择

       单选按钮<input type='radio'>  设置checked属性可以表示某项为默认选择项

       下拉列表<select>/<option>    设置selected属性可以表示某项为默认选择项

       需要给每一个选项设置value属性,该属性用于在服务器端检查哪一个选项被选择,即value的值为传到后台服务器的值。

   (3)多项选择

       复选框<input type='checkbox'>  需要给每个输入控件设置一个不同的【name】属性

   (4)文件上传

       文件上传控件<input type='file'>  通过属性accept可以设置上传文件类型

   (5)边框即提交

       边框控件<fieldset> 可以将所有其他控件包含在一起

       提交控件<submit> 同value属性设置控件的显示名称(一个表单可以有多个<submit> 控件)


二、表单事件

   1、onchange:表单元素的内容发生改变时;

   2、onfocus:获取焦点时触发;

   3、oninpu:元素换取用户的输入;

   4、onreset:表单重置时;

   5、onselect:用户选取文本时;

   6、onsubmit:表单提交时;


三、django简单表单处理流程

   1、在templates新建html文件,如form.html如下

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title>表单测试</title>
</head>
<body>
   <form action="/annotate/search/"method="get">
       <input type="text"name="q">
       <input type="submit"value="search">
   </form>
</body>
</html>

   2、在views.py中构造响应函数    

def form_test(request):
   return render(request,'annotate/form.html')

   3、在urls.py中添加url路径      

url(r'^form/$', views.form_test)

   4、启用服务器,页面显示为


  5、在文本框中输入内容后,后台代码使用“get”接收前台内容,并返回给前端

def form_action(request):

   if 'q' in request.GET:
message = 'You searched for: %r' % request.GET['q']
else:
message = 'You submitted an empty form.'
return HttpResponse(message)

   6、配置表单处理页面url

url(r'^search/$', views.form_action)

7、在文本框输入“大家好”后点击提交按钮,得到如下页面




参考资料:

[1]http://blog.csdn.net/dapeng0802/article/details/49538771

[2]http://www.jb51.net/article/84269.htm(表单事件处理方法详解)






https://blog.sciencenet.cn/blog-3360373-1094784.html

上一篇:数据结构之排序一(python实现)
下一篇:在前端页面显示日历
收藏 IP: 218.30.113.*| 热度|

0

该博文允许注册用户评论 请点击登录 评论 (0 个评论)

数据加载中...

Archiver|手机版|科学网 ( 京ICP备07017567号-12 )

GMT+8, 2024-4-26 19:07

Powered by ScienceNet.cn

Copyright © 2007- 中国科学报社

返回顶部