【转】JSP提交表单
设计表单页面,它是静态页面,使用HTML编写,而且使用了JavaScript脚本语言来验证填写表单数据,表单页面为form.htm,代码如下:
<html>
<head><title>教师信息登记表</title></head>
<script language="JavaScript">
function checkit(){
var theForm;
theForm=document.teacForm;
if(theForm.Name.value==""){
alert("请输入教师注册名!");
document.teacForm.Name.focus();
return false;
}
if(theForm.TrueName.value==""){
alert("请输入教师真实姓名!");
theForm.TrueName.focus();
return false;
}
if(theForm.PersonalCode.value==""){
alert("身份证号码不能为空!");
theForm.PersonalCode.focus();
return false;
}
if(theForm.pwd.value==""){
alert("密码不能为空!");
theForm.pwd.focus();
return false;
}
if(theForm.cfmpwd.value==""){
alert("前后两次输入的密码不一致!");
theForm.cfmpwd.focus();
return false;
}
if(theForm.BirthDate.value==""){
alert("请选择出生日期!");
theForm.BirthDate.focus();
return false;
}
if(theForm.HomeNum.value==""){
alert("电话号码不能为空!");
theForm.HomeNum.focus();
return false;
}
if(theForm.Email.value==""){
alert("Email不能为空!");
theForm.Email.focus();
return false;
}
if(theForm.Office.value==""){
alert("请选择办公所在教研室!");
theForm.Office.focus();
return false;
}
if(theForm.Edu.value==""){
alert("请选择您的最高学历!");
theForm.Edu.focus();
return false;
}
if(theForm.Post.value==""){
alert("请选择您的职称!");
theForm.Post.focus();
return false;
}
theForm.submit();
}
</script>
<body>
<center>
<h1>教师信息登记表</h1>
<hr>
<form name="teacForm" action="submitform.jsp" method="post">
<table>
<tbody>
<tr>
<td><b>注册名称</b></td>
<td><input type="text" name="Name" size="10"></td>
</tr>
<tr>
<td><b>登陆密码</b></td>
<td><input type="password" name="pwd" size="20"></td>
</tr>
<tr>
<td><b>重复密码</b></td>
<td><input type="password" name="cfmpwd" size="20"></td>
</tr>
<tr>
<td><b>真实姓名</b></td>
<td><input type="text" name="TrueName" size="10"></td>
</tr>
<tr>
<td><b>身份证号</b></td>
<td><input type="text" name="PersonalCode" size="20"></td>
</tr>
<tr>
<td><b>性别</b></td>
<td>
<input type="radio" value="男" name="Sex" checked>男
<input type="radio" value="女" name="Sex">女
</td>
</tr>
<tr>
<td><b>出生日期</b></td>
<td><select name="BirthDate">
<option checked value=""></option>
<option value="1952">1952</option>
<option value="1953">1953</option>
<option value="1954">1954</option>
<option value="1955">1955</option>
<option value="1956">1956</option>
<option value="1957">1957</option>
<option value="1958">1958</option>
<option value="1959">1959</option>
<option value="1960">1960</option>
<option value="1961">1961</option>
<option value="1962">1962</option>
<option value="1963">1963</option>
<option value="1964">1964</option>
<option value="1965">1965</option>
<option value="1966">1966</option>
<option value="1967">1967</option>
<option value="1968">1968</option>
<option value="1969">1969</option>
<option value="1970">1970</option>
<option value="1971">1971</option>
<option value="1972">1972</option>
<option value="1973">1973</option>
<option value="1974">1974</option>
<option value="1975">1975</option>
<option value="1976">1976</option>
<option value="1977">1977</option>
<option value="1978">1978</option>
<option value="1979">1979</option>
<option value="1980">1980</option>
<option value="1981">1981</option>
<option value="1982">1982</option>
<option value="1983">1983</option>
<option value="1984">1984</option>
<option value="1985">1985</option>
</select>
</td>
</tr>
<tr>
<td><b>联系电话</b></td>
<td><input type="text" name="HomeNum" size="15"></td>
</tr>
<tr>
<td><b></b>E-mail</td>
<td><input type="text" name="Email" size="30"></td>
</tr>
<tr>
<td><b>办公地点</b></td>
<td>
<select name="Office">
<option checked value=""></option>
<option value="理学院院长室">院长室</option>
<option value="理学院副院长室">副院长室</option>
<option value="信息与计算科学教研室">信息与计算科学教研室</option>
<option value="基础数学教研室">基础数学教研室</option>
</select>
</td>
</tr>
<tr>
<td><b>最高学历</b></td>
<td>
<select name="Edu">
<option checked value=""></option>
<option value="院士">院士</option>
<option value="博士后">博士后</option>
<option value="博士">博士</option>
<option value="硕士">硕士</option>
<option value="学士">学士</option>
</select>
</td>
</tr>
<tr>
<td><b>职称</b></td>
<td>
<select name="Post">
<option checked value=""></option>
<option value="教授">教授</option>
<option value="副教授">副教授</option>
<option value="讲师">讲师</option>
<option value="助教">助教</option>
<option value="助读">助读</option>
</select>
</td>
</tr>
</tbody>
</table>
<p align="center">
<input type="button" value="提交" name="Submit" onclick="checkit()">
<input type="reset" value="重填" name="Submit2">
</p>
</form>
</body>
</html>
<head><title>教师信息登记表</title></head>
<script language="JavaScript">
function checkit(){
var theForm;
theForm=document.teacForm;
if(theForm.Name.value==""){
alert("请输入教师注册名!");
document.teacForm.Name.focus();
return false;
}
if(theForm.TrueName.value==""){
alert("请输入教师真实姓名!");
theForm.TrueName.focus();
return false;
}
if(theForm.PersonalCode.value==""){
alert("身份证号码不能为空!");
theForm.PersonalCode.focus();
return false;
}
if(theForm.pwd.value==""){
alert("密码不能为空!");
theForm.pwd.focus();
return false;
}
if(theForm.cfmpwd.value==""){
alert("前后两次输入的密码不一致!");
theForm.cfmpwd.focus();
return false;
}
if(theForm.BirthDate.value==""){
alert("请选择出生日期!");
theForm.BirthDate.focus();
return false;
}
if(theForm.HomeNum.value==""){
alert("电话号码不能为空!");
theForm.HomeNum.focus();
return false;
}
if(theForm.Email.value==""){
alert("Email不能为空!");
theForm.Email.focus();
return false;
}
if(theForm.Office.value==""){
alert("请选择办公所在教研室!");
theForm.Office.focus();
return false;
}
if(theForm.Edu.value==""){
alert("请选择您的最高学历!");
theForm.Edu.focus();
return false;
}
if(theForm.Post.value==""){
alert("请选择您的职称!");
theForm.Post.focus();
return false;
}
theForm.submit();
}
</script>
<body>
<center>
<h1>教师信息登记表</h1>
<hr>
<form name="teacForm" action="submitform.jsp" method="post">
<table>
<tbody>
<tr>
<td><b>注册名称</b></td>
<td><input type="text" name="Name" size="10"></td>
</tr>
<tr>
<td><b>登陆密码</b></td>
<td><input type="password" name="pwd" size="20"></td>
</tr>
<tr>
<td><b>重复密码</b></td>
<td><input type="password" name="cfmpwd" size="20"></td>
</tr>
<tr>
<td><b>真实姓名</b></td>
<td><input type="text" name="TrueName" size="10"></td>
</tr>
<tr>
<td><b>身份证号</b></td>
<td><input type="text" name="PersonalCode" size="20"></td>
</tr>
<tr>
<td><b>性别</b></td>
<td>
<input type="radio" value="男" name="Sex" checked>男
<input type="radio" value="女" name="Sex">女
</td>
</tr>
<tr>
<td><b>出生日期</b></td>
<td><select name="BirthDate">
<option checked value=""></option>
<option value="1952">1952</option>
<option value="1953">1953</option>
<option value="1954">1954</option>
<option value="1955">1955</option>
<option value="1956">1956</option>
<option value="1957">1957</option>
<option value="1958">1958</option>
<option value="1959">1959</option>
<option value="1960">1960</option>
<option value="1961">1961</option>
<option value="1962">1962</option>
<option value="1963">1963</option>
<option value="1964">1964</option>
<option value="1965">1965</option>
<option value="1966">1966</option>
<option value="1967">1967</option>
<option value="1968">1968</option>
<option value="1969">1969</option>
<option value="1970">1970</option>
<option value="1971">1971</option>
<option value="1972">1972</option>
<option value="1973">1973</option>
<option value="1974">1974</option>
<option value="1975">1975</option>
<option value="1976">1976</option>
<option value="1977">1977</option>
<option value="1978">1978</option>
<option value="1979">1979</option>
<option value="1980">1980</option>
<option value="1981">1981</option>
<option value="1982">1982</option>
<option value="1983">1983</option>
<option value="1984">1984</option>
<option value="1985">1985</option>
</select>
</td>
</tr>
<tr>
<td><b>联系电话</b></td>
<td><input type="text" name="HomeNum" size="15"></td>
</tr>
<tr>
<td><b></b>E-mail</td>
<td><input type="text" name="Email" size="30"></td>
</tr>
<tr>
<td><b>办公地点</b></td>
<td>
<select name="Office">
<option checked value=""></option>
<option value="理学院院长室">院长室</option>
<option value="理学院副院长室">副院长室</option>
<option value="信息与计算科学教研室">信息与计算科学教研室</option>
<option value="基础数学教研室">基础数学教研室</option>
</select>
</td>
</tr>
<tr>
<td><b>最高学历</b></td>
<td>
<select name="Edu">
<option checked value=""></option>
<option value="院士">院士</option>
<option value="博士后">博士后</option>
<option value="博士">博士</option>
<option value="硕士">硕士</option>
<option value="学士">学士</option>
</select>
</td>
</tr>
<tr>
<td><b>职称</b></td>
<td>
<select name="Post">
<option checked value=""></option>
<option value="教授">教授</option>
<option value="副教授">副教授</option>
<option value="讲师">讲师</option>
<option value="助教">助教</option>
<option value="助读">助读</option>
</select>
</td>
</tr>
</tbody>
</table>
<p align="center">
<input type="button" value="提交" name="Submit" onclick="checkit()">
<input type="reset" value="重填" name="Submit2">
</p>
</form>
</body>
</html>
通过上面的表单:
<form name="teacForm" action="submitform.jsp" method="post">
我们想要将用户提交的表单提交到submitform.jsp页面进行处理,接下来完成submitform.jsp页面处理表单的工作,程序代码如下:
<%@ page language="java" contentType="text/html;charset=GB2312"%>
<%@ page import="java.util.*,java.io.*" %>
<html>
<head><title>教师信息登记表</title></head>
<body>
<!--对提交到该JSP页面含有中文的信息实现以中文正常显示-->
<%request.setCharacterEncoding("GBK");%>
<center>
<table width="400">
<tbody>
<tr>
<td><b>注册名称</b></td>
<!--从用户提交表单获取注册名称-->
<td><%=request.getParameter("Name")%></td>
</tr>
<tr>
<td><b>登陆密码</b></td>
<!--从用户提交表单获取登录密码-->
<td><%=request.getParameter("pwd")%></td>
</tr>
<tr>
<td><b>真实姓名</b></td>
<!--从用户提交表单获取真是姓名-->
<td><%=request.getParameter("TrueName")%></td>
</tr>
<tr>
<td><b>身份证号</b></td>
<!--从用户提交表单获取身份证号-->
<td><%=request.getParameter("PersonalCode")%></td>
</tr>
<tr>
<td><b>性别</b></td>
<!--从用户提交表单获取性别-->
<td>
<%=request.getParameter("Sex")%>
</td>
</tr>
<tr>
<td><b>出生日期</b></td>
<!--从用户提交表单获取出生日期-->
<td><%=request.getParameter("BirthDate")%></td>
</tr>
<tr>
<td><b>联系电话</b></td>
<!--从用户提交表单获取联系电话-->
<td><%=request.getParameter("HomeNum")%></td>
</tr>
<tr>
<td><b></b>E-mail</td>
<td><%=request.getParameter("Email")%></td>
</tr>
<tr>
<td><b>办公地点</b></td>
<!--从用户提交表单获取办公地点-->
<td><%=request.getParameter("Office")%></td>
</tr>
<tr>
<td><b>最高学历</b></td>
<!--从用户提交表单获取最高学历-->
<td><%=request.getParameter("Edu")%></td>
</tr>
<tr>
<td><b>职称</b></td>
<!--从用户提交表单获取职称-->
<td><%=request.getParameter("Post")%></td>
</tr>
</tbody>
</table>
</center>
</body>
</html>
<%@ page import="java.util.*,java.io.*" %>
<html>
<head><title>教师信息登记表</title></head>
<body>
<!--对提交到该JSP页面含有中文的信息实现以中文正常显示-->
<%request.setCharacterEncoding("GBK");%>
<center>
<table width="400">
<tbody>
<tr>
<td><b>注册名称</b></td>
<!--从用户提交表单获取注册名称-->
<td><%=request.getParameter("Name")%></td>
</tr>
<tr>
<td><b>登陆密码</b></td>
<!--从用户提交表单获取登录密码-->
<td><%=request.getParameter("pwd")%></td>
</tr>
<tr>
<td><b>真实姓名</b></td>
<!--从用户提交表单获取真是姓名-->
<td><%=request.getParameter("TrueName")%></td>
</tr>
<tr>
<td><b>身份证号</b></td>
<!--从用户提交表单获取身份证号-->
<td><%=request.getParameter("PersonalCode")%></td>
</tr>
<tr>
<td><b>性别</b></td>
<!--从用户提交表单获取性别-->
<td>
<%=request.getParameter("Sex")%>
</td>
</tr>
<tr>
<td><b>出生日期</b></td>
<!--从用户提交表单获取出生日期-->
<td><%=request.getParameter("BirthDate")%></td>
</tr>
<tr>
<td><b>联系电话</b></td>
<!--从用户提交表单获取联系电话-->
<td><%=request.getParameter("HomeNum")%></td>
</tr>
<tr>
<td><b></b>E-mail</td>
<td><%=request.getParameter("Email")%></td>
</tr>
<tr>
<td><b>办公地点</b></td>
<!--从用户提交表单获取办公地点-->
<td><%=request.getParameter("Office")%></td>
</tr>
<tr>
<td><b>最高学历</b></td>
<!--从用户提交表单获取最高学历-->
<td><%=request.getParameter("Edu")%></td>
</tr>
<tr>
<td><b>职称</b></td>
<!--从用户提交表单获取职称-->
<td><%=request.getParameter("Post")%></td>
</tr>
</tbody>
</table>
</center>
</body>
</html>
测试代码:
启动Tomcat Web 服务器,在IE地址栏中键入下面超链接地址:
http://localhost:8080/sky2098/form/form.htm
打开表单页面,如图所示:
填写表单拟测试数据,用于测试页面处理情况,如图所示:
点击“提交”按钮,将数据提交,JSP页面将处理后的数据写回客户端页面,如图所示:
表单数据提交成功。
转账地址http://blog.csdn.net/sky2098/article/details/1540331