问题描述:
有多个页面,(1)选择课程-->(2)选择班级-->(3)选择考试-->(4)选择试卷-->(5)处理选择结果
每一步都向下一个页面传递一个参数,
要求每个页面都有上一步、下一步按钮(第一个页面和最后一个页面除外)
并且点击上一步时,能把先前选择的结果保留
------------------------------------------------------
解决方法:
后台用的是struts2框架
后台代码如下:
package demo.action;
import com.opensymphony.xwork2.ActionSupport;
public class SelectAction extends ActionSupport {
/**
* 课程名称
*/
private String courseName;
/**
* 年级
*/
private String grade;
/**
* 班级
*/
private String classNo;
/**
* 考试
*/
private String examId;
/**
* 试卷
*/
private String paperId;
/**
* step 1 选择课程
*
* @return
*/
public String selectCourse() {
return "success";
}
/**
* step 2 选择班级
*
* @return
*/
public String selectClass() {
return "success";
}
/**
* step 3 选择考试
*
* @return
*/
public String selectExam() {
return "success";
}
/**
* step 4 选择试卷
*
* @return
*/
public String selectPaper() {
return "success";
}
/**
* step 5 处理选择结果
*
* @return
*/
public String selectResult() {
return "success";
}
// get/set方法省略
}
struts.xml中的action配置如下:
<action name="select*" class="demo.action.SelectAction" method="select{1}"> <result name="success">/jsp/select/select{1}.jsp</result> </action>
5个jsp页面如下:
selectCourse.jsp
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href="<%=basePath%>"> <script type="text/javascript"> function toPage(href) { document.forms[0].action = href; document.forms[0].submit(); } </script> </head> <body> <div>选择课程-->选择班级-->选择考试-->选择试卷</div> <div> (${courseName })-->(${grade }--${classNo })-->(${examId })-->(${paperId }) </div> <h3>选择课程</h3> <form action="selectClass.action"> courseName: <input type="text" name="courseName" value="${courseName }"/><br/> <input type="reset" value="重置"/> <input type="submit" value="下一步"/> </form> </body> </html>
selectClass.jsp
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href="<%=basePath%>"> <script type="text/javascript"> function toPage(href) { document.forms[0].action = href; document.forms[0].submit(); } </script> </head> <body> <div>选择课程-->选择班级-->选择考试-->选择试卷</div> <div> (${courseName })-->(${grade }--${classNo })-->(${examId })-->(${paperId }) </div> <h3>选择班级</h3> <form action="selectExam.action"> <input type="hidden" name="courseName" value="${courseName }"/> grade: <input type="text" name="grade" value="${grade }"/><br/> classNo: <input type="text" name="classNo" value="${classNo }"/><br/> <input type="button" οnclick="toPage('selectCourse.action');" value="上一步"/> <input type="submit" value="下一步"/> </form> </body> </html>
selectExam.jsp
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href="<%=basePath%>"> <script type="text/javascript"> function toPage(href) { document.forms[0].action = href; document.forms[0].submit(); } </script> </head> <body> <div>选择课程-->选择班级-->选择考试-->选择试卷</div> <div> (${courseName })-->(${grade }--${classNo })-->(${examId })-->(${paperId }) </div> <h3>选择考试</h3> <form action="selectPaper.action"> <input type="hidden" name="courseName" value="${courseName }"/> <input type="hidden" name="grade" value="${grade }"/> <input type="hidden" name="classNo" value="${classNo }"/> examId: <input type="text" name="examId"/><br/> <input type="button" οnclick="toPage('selectClass.action');" value="上一步"/> <input type="submit" value="下一步"/> </form> </body> </html>
selectPaper.jsp
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href="<%=basePath%>"> <script type="text/javascript"> function toPage(href) { document.forms[0].action = href; document.forms[0].submit(); } </script> </head> <body> <div>选择课程-->选择班级-->选择考试-->选择试卷</div> <div> (${courseName })-->(${grade }--${classNo })-->(${examId })-->(${paperId }) </div> <h3>选择试卷</h3> <form action="selectResult.action"> <input type="hidden" name="courseName" value="${courseName }"/> <input type="hidden" name="grade" value="${grade }"/> <input type="hidden" name="classNo" value="${classNo }"/> <input type="hidden" name="examId" value="${examId }"/> paperId: <input type="text" name="paperId" value="${paperId }"/><br/> <input type="button" οnclick="toPage('selectExam.action');" value="上一步"/> <input type="submit" value="下一步"/> </form> </body> </html>
selectResult.jsp
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href="<%=basePath%>"> <script type="text/javascript"> function toPage(href) { document.forms[0].action = href; document.forms[0].submit(); } </script> </head> <body> <div>选择课程-->选择班级-->选择考试-->选择试卷</div> <div> (${courseName })-->(${grade }--${classNo })-->(${examId })-->(${paperId }) </div> <h3>选择结果</h3> <form action=""> <input type="hidden" name="courseName" value="${courseName }"/> <input type="hidden" name="grade" value="${grade }"/> <input type="hidden" name="classNo" value="${classNo }"/> <input type="hidden" name="examId" value="${examId }"/> <input type="hidden" name="paperId" value="${paperId }"/> <input type="button" οnclick="toPage('selectPaper.action');" value="上一步"/> </form> </body> </html>
------------------------------------------------------
总结:
1.对js不熟
document.forms[0].action='dddddd'可对form进行修改、提交等操作
2.隐藏域的灵活应用
------------------------------------------------------