用 Spring MVC 来处理向导式复杂表单

2008-10-14 14:45:27　来源:中国自学编程网　作者:佚名 点击:

---

我们在网上经常会碰到一些向导式的表单页面，比如 第一步 >> 第二步 >> 第三步…、基本信息 >> 联系方式 >> 兴趣爱好…。它们都是按类型分到多个有序的页面要你来完成填写的。当然，你也可以把它们全部罗列在一个页面里，那样用户就会感觉茫茫然，分不清主次，可能不会很好的予以配合。

 

　　我们在网上经常会碰到一些向导式的表单页面，比如 第一步 >> 第二步 >> 第三步…、基本信息 >> 联系方式 >> 兴趣爱好…。它们都是按类型分到多个有序的页面要你来完成填写的。当然，你也可以把它们全部罗列在一个页面里，那样用户就会感觉茫茫然，分不清主次，可能不会很好的予以配合。

然而像 Struts、WebWork 那样的 MVC 框架未提供类似的实现，都需自己采用某种方式来实现向导，可以用层的隐现方式，或逐步把填写的部分数据放 Session 中，最后汇总处理。幸运的是 Spring MVC 考虑到了这种应用需求，它提供了一个 org.springframework.web.servlet.mvc.AbstractWizardFormController 来满足你。

下面我们来参照 CSDN 的简历向导(界面如下) 来自己动手做个例子

 

详细的步骤如下(如何创建 Spring MVC 工程在此不细说，本例中用的是 Spring 2.0，其他版本的 Spring 原理无甚差异，只是 Spring 2.0 开始有很方便使用的 form 标签，而在 Spring 1.0 中要用 spring:bind 和 jstl 结合显示数据着实显得很寒碜，由此可见 Spring 1 的 MVC 还太不成熟)。本页中列出的代码有些非关键之处省去了，文后附上了本例完整的工程文件，可下载。

一. 定义好需求

为了使我们尽快掌握 AbstractWizardFormController 的使用，而不至让具体业务所纠缠。故而，这里要对 CSDN 的简历向导大大的简化，简化后的向导页和每页的填写内容如下：

1. 求职意向(期望工作地点-必填，期望月薪)
2. 基本信息(姓名-必填、手机号码-必填)
3. 工作经历(单个文本框录入)
4. 项目经验(单个文本框录入)
5. 完成页，Congratulations

每页操作完之后，点击“下一步”按钮进到下一页面，同时要对标识为必填项进行非空验证。用户也可以点“上一步”按钮重填上一页面的信息。用户可以中途点击“取消”按钮取消向导。最后在项目经验向导页面，点击“完成”按钮处理表单数据，成功后显示 Congratulations 页。

二. 定义接收表单数据的 Command 类(Resume)

这里我们定义为 com.unmi.bean.Resume，代码如下：

Code ViewCopyPrint
package com.unmi.bean;

public class Resume {
private String workPlace; //期望工作地点
private int salary; //期望薪水
private String name; //姓名
private String mobile; //手机号码
private String experience; //工作经历
private String projects; //项目此验

//...... 相应的 getter/setter 方法此处略去
}
package com.unmi.bean;

public class Resume {
private String workPlace; //期望工作地点
private int salary; //期望薪水
private String name; //姓名
private String mobile; //手机号码
private String experience; //工作经历
private String projects; //项目此验

//...... 相应的 getter/setter 方法此处略去
}

三. 创建向导控制器(ResumeWizardController)

Code ViewCopyPrint
package com.unmi.webapp.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 com.unmi.bean.Resume;

/**
* 处理简单向导表单的控制类
* @author Unmi
*/
public class ResumeWiardController extends AbstractWizardFormController {

public ResumeWiardController(){
setCommandClass(Resume.class); //设置命令类
}

//处理表单数据
protected ModelAndView processFinish(HttpServletRequest request,
HttpServletResponse response, Object command, BindException errors)
throws Exception {

//完成表单时获取到所有填写数据，调用业务类来处理
Resume resume = (Resume)command;
//resumeService.submitResume(resume);

return new ModelAndView("congratulations"); //完了后，转到祝贺页面
}

/**
* 向导中每一页面都要调用的验证方法，用 page 识别当前面
*/
protected void validatePage(Object command, Errors errors, int page) {
ResumeValidator validator = (ResumeValidator)getValidator();

if(page == 0){//验证求职意向页面
validator.validateWorkplace("workPlace", errors);
}
else if(page == 1){//验证档基本信息页面
validator.validateName("name", errors);
validator.validateMobile("mobile", errors);
}
}
}
package com.unmi.webapp.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 com.unmi.bean.Resume;

/**
* 处理简单向导表单的控制类
* @author Unmi
*/
public class ResumeWiardController extends AbstractWizardFormController {

9 7 3 1 2 3 4 4 8 :