PHP快速入门之表单处理

7.1案例介绍

表单,在网页中的作用不可小视,主要负责数据采集的功能,比如你可以采集访问者的名字和e-mail地址、调查表、留言簿等等。

7.2分析案例

运用各种表单控件收集用户信息

7.3核心知识

Form

文本框

文本域

密码框

隐藏框

复选框

单选框

下拉选择框

提交按钮

重置按钮

$_POST

$_GET

7.4知识讲解

7.4.1 表单的组成

 一个表单有三个基本组成部分:表单标签:这里面包含了处理表单数据所用CGI程序的URL以及数据提交到服务器的方法。 表单域:包含了文本框、密码框、隐藏域、多行文本框、复选框、单选框、下拉选择框和文件上传框等。表单按钮:包括提交按钮、复位按钮和一般按钮;用于将数据传送到服务器上的CGI脚本或者取消输入,还可以用表单按钮来控制其他定义了处理脚本的处理工作。为了顾及不同的网页设计工具,本文只讲述代码的设计,不具体讲述操作方法,下面就是表单的HTML代码设计要点:

表单的用途

用户注册某种服务时,收集其姓名、地址、电话号码、电子邮件地址和其他信息。

收集购买物品所需的信息。例如,如果想通过Internet 购买一本书,就需要填写姓名、邮政地址和付款方式等。

7.4.2 表单控件

1 表单标签

<form></form>

功能:用于声明表单,定义采集数据的范围,也就是<form>和</form>里面包含的数据将被提交到服务器或者电子邮件里。

语法:<FORM ACTION="URL" METHOD="GET|POST" ENCTYPE="MIME" TARGET="...">. . .</FORM>

属性解释见下表:

 action=url指定一来处理提交表单的格式.它可以是一个URL地址(提交给程式)或一个电子邮件地址.

 method=get或post指明提交表单的HTTP方法.可能的值为: post:POST方法在表单的主干包含名称/值对并且无需包含于action特性的URL中. get:不赞成。GET方法把名称/值对加在action的URL后面并且把新的URL送至服务器.这是往前兼容的缺省值.这个值由于国际化的原因不赞成 使用.

 enctype=cdata指明用来把表单提交给服务器时(当method值为"post")的互联网媒体形式.这个特性的缺省值是"application/x-www-form-urlencoded"

 TARGET="..."指定提交的结果文档显示的位置: _blank :在一个新的、无名浏览器窗口调入指定的文档; _self :在指向这个目标的元素的相同的框架中调入文档;_parent:把文档调入当前框的直接的父FRAMESET框中;这个值在当前框没有父框时等价于_self;  

  例如:

  <form action="http://www.xxx.com/test.asp" method="post" target="_blank">...</form>

 表示表单将向http://www.xxx.com/test.asp以post的方式提交,提交的结果在新的页面显示,数据提交的媒体方式是默认的application/x-www-form-urlencoded方式;

  表单域 

 表单域包含了文本框、多行文本框、密码框、隐藏域、复选框、单选框和下拉选择框等,用于采集用户的输入或选择的数据,下面分别讲述这些表单域的代码格式:

2 文本框

文本框是一种让访问者自己输入内容的表单对象,通常被用来填写单个字或者简短的回答,如姓名、地址等。

代码格式:<input type="text" name="..." size="..." maxlength="..." value="...">

属性解释:

  type="text"定义单行文本输入框;

  name属性定义文本框的名称,要保证数据的准确采集,必须定义一个独一无二的名称;

  size属性定义文本框的宽度,单位是单个字符宽度;

  maxlength属性定义最多输入的字符数。

  value属性定义文本框的初始值

  样例1:

  样例1代码:

  <input type="text" name="example1" size="20" maxlength="15">

3 文本域

也是一种让访问者自己输入内容的表单对象,只不过能让访问者填写较长的内容。

代码格式:<TEXTAREA name="..." cols="..." rows="..." wrap="VIRTUAL"></TEXTAREA>

属性解释:

 name属性定义多行文本框的名称,要保证数据的准确采集,必须定义一个独一无二的名称;

 cols属性定义多行文本框的宽度,单位是单个字符宽度;

 rows属性定义多行文本框的高度,单位是单个字符宽度;

 wrap属性定义输入内容大于文本域时显示的方式,可选值如下:

 默认值是文本自动换行;当输入内容超过文本域的右边界时会自动转到下一行,而数据在被提交处理时自动换行的地方不会有换行符出现;Off,用来避免文本换行,当输入的内容超过文本域右边界时,文本将向左滚动,必须用Return才能将插入点移到下一行; Virtual,允许文本自动换行。当输入内容超过文本域的右边界时会自动转到下一行,而数据在被提交处理时自动换行的地方不会有换行符出现; Physical,让文本换行,当数据被提交处理时换行符也将被一起提交处理。

  样例2:

  样例2代码:

  <TEXTAREA name="example2" cols="20" rows="2" wrap="PHYSICAL"></TEXTAREA>

4 密码框

是一种特殊的文本域,用于输入密码。当访问者输入文字时,文字会被星号或其它符号代替,而输入的文字会被隐藏。

代码格式:<input type="password" name="..." size="..." maxlength="...">

属性解释:

  type="password"定义密码框;

  name属性定义密码框的名称,要保证数据的准确采集,必须定义一个独一无二的名称;

  size属性定义密码框的宽度,单位是单个字符宽度;

  maxlength属性定义最多输入的字符数。

  样例3:

  样例3代码:

  <input type="password" name="example3" size="20" maxlength="15">

5 隐藏域

隐藏域是用来收集或发送信息的不可见元素,对于网页的访问者来说,隐藏域是看不见的。当表单被提交时,隐藏域就会将信息用你设置时定义的名称和值发送到服务器上。

代码格式:<input type="hidden" name="..." value="...">

属性解释:

  type="hidden"定义隐藏域;

  name属性定义隐藏域的名称,要保证数据的准确采集,必须定义一个独一无二的名称;

  value属性定义隐藏域的值

  例如:<input type="hidden" name="ExPws" value="dd">

6 复选框

复选框允许在待选项中选中一项以上的选项。每个复选框都是一个独立的元素,都必须有一个唯一的名称。

代码格式:<INPUT type="checkbox" name="..." value="...">

属性解释:

  type="checkbox"定义复选框;

  name属性定义复选框的名称,要保证数据的准确采集,必须定义一个独一无二的名称;

  value属性定义复选框的值

  样例4: xxx.com xxx.com

  样例4代码:

  <input type="checkbox" name="yesky" value="09">xxxcom

  <input type="checkbox" name="Chinabyte" value="08">xxx.com

7 单选框

当需要访问者在待选项中选择唯一的答案时,就需要用到单选框了。

代码格式:<input type="radio" name="..." value="...">

属性解释:

  type="radio"定义单选框;

  name属性定义单选框的名称,要保证数据的准确采集,单选框都是以组为单位使用的,在同一组中的单选项都必须用同一个名称;

  value属性定义单选框的值,在同一组中,它们的域值必须是不同的。

  样例5: xxx.com xxx.com

  样例5代码:

  <input type="radio" name="myFavor" value="1">xxx.com

  <input type="radio" name="myFavor" value="2">xxx.com

8 下拉选择框

下拉选择框允许你在一个有限的空间设置多种选项。

代码格式:

  <select name="..." size="..." multiple>

  <option value="..." selected>...</option>

  ...

  </select>

属性解释:

  size属性定义下拉选择框的行数;

  name属性定义下拉选择框的名称;

  multiple属性表示可以多选,如果不设置本属性,那么只能单选;

  value属性定义选择项的值;

  selected属性表示默认已经选择本选项。

  样例7: xxx.com xxx.com

  样例7代码:

  <select name="mySel" size="1">

  <option value="1" selected>xxx.com</option>

  <option value="d2">xxx.com</option>

  </select>

  样例8:

  xxx.com xxx.com internet.com按Ctrl可以多选

  样例8代码:

  <select name="mySelt" size="3" multiple>

  <option value="1" selected>xxx.com</option>

  <option value="d2">xxx.com</option>

  <option value="3">internet.com</option>

  </select>

9 表单按钮

 表单按钮控制表单的运作。

1.3.1提交按钮

 提交按钮用来将输入的信息提交到服务器。

 代码格式:<input type="submit" name="..." value="...">

 属性解释:

  type="submit"定义提交按钮;

  name属性定义提交按钮的名称;

  value属性定义按钮的显示文字;

  样例9:

  样例9代码:

  <input type="submit" name="mySent" value="发送">

1.3.2复位按钮

 复位按钮用来重置表单。

 代码格式:<input type="reset" name="..." value="...">

 属性解释:

  type="reset"定义复位按钮;

  name属性定义复位按钮的名称;

  value属性定义按钮的显示文字;

  样例10:

  样例10代码:

  <input type="reset" name="myCancle" value="取消">

1.3.3一般按钮

 一般按钮用来控制其他定义了处理脚本的处理工作。

 代码格式:<input type="button" name="..." value="..." onClick="...">

 属性解释:

  type="button"定义一般按钮;

  name属性定义一般按钮的名称;

  value属性定义按钮的显示文字;

  onClick属性,也可以是其它的事件,通过指定脚本函数来定义按钮的行为;

  样例11:

  样例11代码:

  <input type="button" name="myB" value="保存" onClick="javascript:alert('it is a button')">

主要的表单控件:文本框、密码框、单选框、多选框、下拉列表、文字域、图片域、隐藏域、提交按钮、重置按钮等都需要温习。

其中最重要的就是多选框,在PHP中命名多选框是比较特殊的,需要用[]来命名,一组多选的id和name在命名上都是需要注意的。PHP页面如何接收各种控件的值都需要单独练习。尤其是多选项在接收后是一个数组结构的数据,在存入数据库前需要转化成字符串再入库。

代码示范如下:

文本框:

密码框:

单选项:

下拉列表:

多选框:

篮球

上网

旅游

游泳 【提示:需要特别注意的是PHP中对于多选项的命名。】

隐藏域:

提示:隐藏域的使用目的是为了隐式传值,所以必须有value值才有意义。

文本域:

提交:

重置:

每种控件一般常用属性都需要写,name属性为了表单传值;id属性主要用于样式和表单脚本验证;Value属性表示控件初始值,视情形而定;size属性主要是定义控件的大小;maxlength属性定义最大允许输入内容的长度。

10 超级全局数组变量

$_POST $_GET这两个变量都是数组变量,下标是表单文本框的name属性。

echo $_POST['username'];//用户名

echo $_POST['psd'];//密码

echo $_POST['sex'];//性别

echo $_POST['xueli'];//学历

echo implode(",",$_POST['hobby']);//爱好

echo $_POST['id'];//隐藏域id

echo $_POST['introduce'];//简介


7.5知识运用

7.5.1 用户注册模块功能介绍

用户注册模块是学习表单用到的范例。本模块是大多数网站都会用到的一个功能部分,同时这注册模块也是表单集中体现的一个地方,其中会需要用户填写用户名、密码、邮箱、学历、爱好、性别、简介等,而这又恰恰是表单里边的文本框、密码框、选择框、单选框、文本域等,除此还有提交按钮、重置按钮等。之前同学们有接触过表单,但都是在html下使用的,今天我们学习的表单  是需要和js、php程序结合的。是对表单学习的延续、同时也是在复习以往的学习知识。


注册页效果图如下:


【提示:以上效果图,并非本教学中真实页面图。】

7.5.2 注册模块需求分析(业务逻辑)

一个表单有三个基本组成部分:表单标签:这里面包含了处理表单数据所用CGI程序的URL以及数据提交到服务器的方法。 表单域:包含了文本框、密码框、隐藏域、多行文本框、复选框、单选框、下拉选择框和文件上传框等。表单按钮:包括提交按钮、复位按钮和一般按钮;用于将数据传送到服务器上或者取消输入,还可以用表单按钮来控制其他定义了处理脚本的处理工作。为了顾及不同的网页设计工具,本文只讲述代码的设计,不具体讲述操作方法。

7.5.3 注册模块设计思路(实现思路)

用户注册模块会涉及两个页面,一个表单页面,一个接收页面,其中接收页面用户接收表单页面的数据

表单页面会有文本框、密码框、隐藏框、单选框、选择框、复选框、文本域,按钮会有提交按钮、重置按钮

在接收页面使用php程序语言来接收表单数据,会用到$_POST $_GET两个超级全局数组变量。

本章通过用户注册学习了表单的使用,表单不只可以多用户注册,比如添加商品、修改商品等类似的动作都需要表单在中间协调,希望同学们对表单有很好的理解。

你可能感兴趣的:(PHP快速入门之表单处理)