java spring 使用GuideController实现信息的多步采集

使用GuideController控制器的目的

在开发中会出现，需要采集大量用户信息来作为数据分析，但是如果是一个单一的页面让用户填写十多行信息，会让用户体验很差，采用向导控制器实现将众多的信息分离就会使得用户体验好很多。
这也就是GuideController的使用目的之一。

项目结构

创建一个web项目，src下创建包Controller,以及User,分别对于控制器的和用户的功能编写。
在WEB-INF下lib包下创建配置文件applicationContext.xml用于Spring的配置。
然后需要一个主页面index.jsp，需要一个结果页面ok.jsp,还需要将原来一个页面存放的信息拆分为三个部分，onePage.jsp,twoPage.jsp,treePage.jsp。
这样项目的结构就写好了。

GuideController的编写

package Controller;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.springframework.validation.BindException;
import org.springframework.web.servlet.ModelAndView;
import org.springframework.web.servlet.mvc.AbstractWizardFormController;

import User.User;

public class GuideController extends AbstractWizardFormController {

	private String cancelView;	//取消时跳转的页面
	private String finishView;	//完成后跳转的页面
	
	public String getCancelView() 
	{
		return cancelView;
	}
	public void setCancelView(String cancelView) 
	{
		this.cancelView = cancelView;
	}
	public String getFinishView() 
	{
		return finishView;
	}
	public void setFinishView(String finishView)
	{
		this.finishView = finishView;
	}
	
	protected ModelAndView processFinish(HttpServletRequest arg0, HttpServletResponse arg1, Object arg2,
			BindException arg3) throws Exception
	{
		User user=(User)arg2;
		return new ModelAndView(this.getFinishView(),"user",user);
	}
	
	protected ModelAndView processCannel(HttpServletRequest arg0, HttpServletResponse arg1, Object arg2,
			BindException arg3) throws Exception
	{
		return new ModelAndView(this.getCancelView());
	}

}

定义两个私有变量cancelView ，finishView用于将分页填写功能中的返回和下一步。

User的编写

package User;

public class User
{
		private String userName;//用户名
		private String pwd;// 密码
		private String pwd1;// 确认密码
		
		private String qq;// qq号码
		private String mail;//电子邮箱
		private String tel;//电话
		private String addr;//地址
		
		private String name;//姓名
		private String age;//年龄
		private String sex;//性别
		private String high;//身高
		private String weight;//体重
		
		public String getPwd1() {
			return pwd1;
		}
		public void setPwd1(String pwd1) {
			this.pwd1 = pwd1;
		}

		public String getUserName() {
			return userName;
		}
		public void setUserName(String userName) {
			this.userName = userName;
		}
		public String getPwd() {
			return pwd;
		}
		public void setPwd(String pwd) {
			this.pwd = pwd;
		}
		public String getQq() {
			return qq;
		}
		public void setQq(String qq) {
			this.qq = qq;
		}
		public String getMail() {
			return mail;
		}
		public void setMail(String mail) {
			this.mail = mail;
		}
		public String getTel() {
			return tel;
		}
		public void setTel(String tel) {
			this.tel = tel;
		}
		public String getAddr() {
			return addr;
		}
		public void setAddr(String addr) {
			this.addr = addr;
		}
		public String getName() {
			return name;
		}
		public void setName(String name) {
			this.name = name;
		}
		public String getAge() {
			return age;
		}
		public void setAge(String age) {
			this.age = age;
		}
		public String getSex() {
			return sex;
		}
		public void setSex(String sex) {
			this.sex = sex;
		}
		public String getHigh() {
			return high;
		}
		public void setHigh(String high) {
			this.high = high;
		}
		public String getWeight() {
			return weight;
		}
		public void setWeight(String weight) {
			this.weight = weight;
		}
}

就是一些变量的set,get方法。

applicationContext.xml的编写

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans-2.5.xsd">

	<!-- 定义视图分解器 -->
	<bean id="viewResolver"
		class="org.springframework.web.servlet.view.InternalResourceViewResolver">

		<property name="viewClass">
			<value>org.springframework.web.servlet.view.InternalResourceView
			</value>
		</property>

		<!-- 设置前缀，即视图所在的路径 -->
		<property name="prefix" value="/" />
		<!-- 设置后缀，即视图的扩展名 -->
		<property name="suffix" value=".jsp" />
	</bean>
	<bean name="user" class="User.User" />

	<bean name="/userReg.do" class="Controller.GuideController">
		<!-- 封装表单的对象 -->
		<property name="commandClass" value="User.User" />
		<!-- 向导页面 -->
		<property name="pages" value="onePage,twoPage,threePage" />
		<!-- 取消后转向的视图 -->
		<property name="cancelView" value="index" />
		<!-- 向导完成后转向的视图 -->
		<property name="finishView" value="ok" />
	</bean>
</beans>

在Spring MVC中都是将控制器如表单控制器，文件名映射控制器，参数映射控制器等作为视图View然后由前端控制器也就是调度器（web.xml文件中的）,来渲染为jsp,html.php等显示出来。
这里也是一样，将GuideController封装为userReg.do视图，让视图解析器去解析为所需要的模型。

web.xml的编写

<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee"
	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xsi:schemaLocation="http://java.sun.com/xml/ns/javaee   http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
	
	<!-- spring编码过滤器 -->	
	<filter>
		<filter-name>encodingFilter</filter-name>
		<filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class>
		<!-- 编码方式 -->
		<init-param>
			<param-name>encoding</param-name>
			<param-value>gbk</param-value>
		</init-param>
		<!-- 强行进行编码转换 -->
		<init-param>
			<param-name>forceEncoding</param-name>
			<param-value>true</param-value>
		</init-param>
	</filter>
	<!-- 过滤的url -->
	<filter-mapping>
		<filter-name>encodingFilter</filter-name>
		<url-pattern>*.do</url-pattern>
	</filter-mapping>
	
	
	<servlet>
		<servlet-name>dispatcherServlet</servlet-name>
		<servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
		<init-param>
			<param-name>contextConfigLocation</param-name>
			<param-value>/WEB-INF/applicationContext.xml</param-value>
		</init-param>
		<load-on-startup>1</load-on-startup>
	</servlet>
	<servlet-mapping>
		<servlet-name>dispatcherServlet</servlet-name>
		<url-pattern>*.do</url-pattern>
	</servlet-mapping>
	<welcome-file-list>
		<welcome-file>index.jsp</welcome-file>
	</welcome-file-list>
	<login-config>
		<auth-method>BASIC</auth-method>
	</login-config>
</web-app>

就配置了字符过滤器和前端控制器。

index.jsp主页面的编写

<%@page contentType="text/html" pageEncoding="GBK"%>
<html>
<head>
<title></title>
<style type="text/css">
<!--
.STYLE1 {
	font-size: 12pt;
	color: #2B6A1B;
	font-weight: bold;
}
body {
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
}
-->
</style>
<meta http-equiv="Content-Type" content="text/html; charset=GBK"></head>
<body>
<table align="center" width="1003" height="620">
  <tr>
    <td>
		<div style="position:relative; top:-30px; left:370px">
			<a href="userReg.do" class="STYLE1">进入用户注册页面 >></a></div>
	</td>
  </tr>
</table>
</body>
</html>

没啥好说的。

ok.jsp结果页面

<%@page contentType="text/html" pageEncoding="GBK"%>
<%@page import="User.*" %> 
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=GBK"><style type="text/css">
<!--
body {
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
}
-->
</style></head>
<body>
<table width="778" height="668" align="center" background="images/bj4.jpg">
  <tr>
    <td>
		<table style="position:relative; top:65px; left:60px">
		<% 
		User user = (User)request.getAttribute("user");
		%>
			<tr>
				<td height="22" colspan="2"><strong>登录信息</strong></td>
			</tr>
			<tr>
				<td height="22">登录账号：</td>
				<td height="22"><%= user.getUserName() %></td>
			</tr>
			<tr>
				<td height="22">登录密码：</td>
				<td height="22"><%= user.getPwd() %></td>
			</tr>
			<tr>
				<td height="22" colspan="2"><strong>基本信息</strong></td>
			</tr>
			<tr>
				<td height="22">姓名：</td>
				<td height="22"><%= user.getName() %></td>
			</tr>
			<tr>
				<td height="22">年龄：</td>
				<td height="22"><%= user.getAge() %></td>
			</tr>
			<tr>
				<td height="22">性别：</td>
				<td height="22"><%= user.getSex() %></td>
			</tr>
			<tr>
				<td height="22">身高：</td>
				<td height="22"><%= user.getHigh() %></td>
			</tr>
			<tr>
				<td height="22">体重：</td>
				<td height="22"><%= user.getWeight() %></td>
			</tr>
			<tr>
				<td height="22" colspan="2"><strong>联系方式</strong></td>
			</tr>
			<tr>
				<td height="22">QQ号码：</td>
				<td height="22"><%= user.getQq() %></td>
			</tr>
			<tr>
				<td height="22">电子邮箱：</td>
				<td height="22"><%= user.getMail() %></td>
			</tr>
			<tr>
				<td height="22">联系电话：</td>
				<td height="22"><%= user.getTel() %></td>
			</tr>
			<tr>
				<td height="22">通信地址：</td>
				<td height="22"><%= user.getAddr() %></td>
			</tr>
	  </table>
	</td>
  </tr>
</table>
</body>
</html>

这里就是获取user的属性。

onePage.jsp的编写

<%@page contentType="text/html" pageEncoding="GBK"%>
<%@taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=GBK"><style type="text/css">
<!--
body {
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
}
-->
</style></head>
<body>
<form:form>
<table width="772" height="666" align="center">
  <tr>
    <td><table style="position:relative; top:-30px; left:150px" border="1" cellpadding="1" cellspacing="1">
        <tr>
          <td width="80" height="23">用户名：</td>
          <td width="311" height="23">&nbsp;
            <form:input path="userName"/></td>
        </tr>
        <tr>
          <td height="23">密码：</td>
          <td height="23">&nbsp;
            <form:password  path="pwd"/></td>
        </tr>
        <tr>
          <td height="23">确认密码：</td>
          <td height="23">&nbsp;
            <form:password path="pwd1"/></td>
        </tr>
		<tr>
          <td height="23" colspan="2" align="center" valign="middle">
          <input type="submit" name="_cancel" value="返回" >&nbsp;&nbsp;
          <input type="submit" name="_target1" value="下一步" /></td>
        </tr>
      </table></td>
  </tr>
</table>
</form:form>
</body>
</html>

twoPage.jsp的编写

<%@page contentType="text/html" pageEncoding="GBK"%>
<%@taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<html>
<head>
<title>第二步</title>
</head>
<body>
<form:form>
<table width="778" height="668" align="center">
  <tr><td>
	<table border="1" cellpadding="1" cellspacing="1" style="position:relative; top:-10px; left:150px">
		<tr>
			<td width="60" height="23">姓名：</td>
			<td width="379" height="23">&nbsp;<form:input path="name"/></td>
		</tr>
		<tr>
			<td height="23">年龄：</td>
			<td height="23">&nbsp;<form:input path="age"/></td>
		</tr>
		<tr>
			<td height="23">性别：</td>
			<td height="23">&nbsp;<form:input path="sex"/></td>
		</tr>
		<tr>
			<td height="23">身高：</td>
			<td height="23">&nbsp;<form:input path="high"/></td>
		</tr>
		<tr>
			<td height="23">体重：</td>
			<td height="23">&nbsp;<form:input path="weight"/></td>
		</tr>
		<tr>
			<td height="23" colspan="2" align="center">
			<input type="submit" name="_target0" value="上一步">&nbsp;&nbsp;&nbsp;
			<input type="submit" name="_target2" value="下一步">
			</td>
		</tr>
	</table>
</td></tr></table>
</form:form>
</body>
</html>

treePage.jsp的编写

<%@page contentType="text/html" pageEncoding="GBK"%>
<%@taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=GBK"><style type="text/css">
<!--
body {
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
}
-->
</style></head>
<body>
<form:form>
  <table width="778" height="668" align="center">
    <tr>
      <td><table border="1" cellpadding="1" cellspacing="1" style="position:relative; top:-30px; left:150px">
          <tr>
            <td width="77" height="23">QQ号码：</td>
			<td width="375" height="23">&nbsp;<form:input path="qq"/></td>
          </tr>
		  <tr>
            <td height="23">电子邮箱：</td>
			<td height="23">&nbsp;<form:input path="mail"/></td>
          </tr>
		  <tr>
            <td height="23">电话号码：</td>
			<td height="23">&nbsp;<form:input path="tel"/></td>
          </tr>
		  <tr>
            <td height="23">通信地址：</td>
			<td height="23">&nbsp;<form:input path="addr"/></td>
          </tr>
		  <tr>
            <td height="23" colspan="2" align="center"> 
            <input type="submit" name="_target1" value="上一步" >&nbsp;&nbsp;
  			<input type="submit" name="_finish" value="确定" >
  			</td>
          </tr>
      </table></td>
    </tr>
  </table>
</form:form>
</body>
</html>

效果一览