如何实现填写大量信息的时候可以分页填写的过程

Question

就是有好多信息要填写，一个页面写不完，要分好3、4个页面完成输入信息的过程。我应该怎么样来实现这个呢？在执行下一步的时候如何保存上一页已经填完的信息呢？

Answer 1

先假定你这3、4的的数据本身是强关联性的，也就是最终应在一个事务中提交，那么一般四种做法：1、切页面但不切数据，可以用jQuery动态加载DIV来实现，也就是虽然是3、4个表单，其实都在一个页面的一个FORM中；这个方法对于数据量规模不是非常大的情况还是不错的，用户体验比较好；2、数据在页面中传递，也就是第一个表单提交后服务端将其数据项生成到第二个表单中，只不过不显示，比如用JSON格式放好或者用hidden控件；这个方法适用于不熟悉jQuery的情况；3、Session中管理，这个应该很容易理解，不展开了；缺点就是如果用户量非常非常的多（几十万以上），可能内存不足；4、暂存，也就是专门提供一个表，暂存这些数据，可以偷懒直接存序列化的二进制流，也可以存JSON字符串，这个随意了；如果表单数量奇多，且还需要切来切去的，这个方法适用。常规情况一般推荐1，需要关照你的是：注意别让用户会话超时。

Answer 2

虽然项目中经常有这样的代码，但是脱离项目知识背景，贴出来你也很难理解：基本借助jQuery实现，我删除掉了部分内容
/**
 * Load the html of form sheet by url parameter 'id'.
 * @param sid Specify sheet's id, 001-016; default is 001
 * @returns Success or not
 */
function loadSheet(sheetId, sequence) {
if (LOG_INFO) log("loadSheet(" + sheetId + ", " + sequence + "): Start.");
var formId = define.formId;
if (sheetId && formId) {
sheetId = ("00" + String(sheetId)).slice(-3);
var sheet = define.sheets[sheetId];
var sheetUrl = FORM_BASE_URL + formId + "/" + formId + "_" + sheetId + ".html"; // Sub page's URL
var divId = "sheet_" + formId + "_" + sheetId; // Check if the sheet was already loaded.
var flagNewFrame = !document.getElementById(divId);
if (flagNewFrame) { // Not founded, create new div.
if (LOG_DEBUG) log("loadSheet(): Sheet " + divId + " not founded, create new: " + sheetUrl);
$('#sheets').append('<div id="' + divId + '" width="100%" height="500"></div>');
$('#' + divId).load(sheetUrl, function() {
var my = $('#' + divId);
my.attr("formId", formId);
my.attr("sheetId", sheetId);
if (typeof (sequence) != "undefined") my.attr("sequence", sequence);
initSheet(divId);
initSheetEvent(divId);
setDataToSheet(divId);
}); if (typeof (sequence) != "undefined") {
$('#multi' + sheetId).append(
'<a href="#' + sheetId + '.' + sequence + '" onclick="loadSheet(\'' + sheetId + '\', '
+ sequence + ');">(' + sequence + ')</a>&nbsp');
}
}
// Hide other sheet (should use CSS class).
$("#sheets").children("div").each(function() {
try {
if (this.id != divId) this.style.display = "none";
else this.style.display = "block";
} catch (ex) {
this.value = ex.message;
}
});
if (LOG_DEBUG) log("loadSheet(): " + flagNewFrame + " " + divId + " " + sheetUrl); if (!flagNewFrame) {
// Just refresh the data.
setDataToSheet(divId);
}
return true;
} else {
log("loadSheet(): formId or sheetId is empty.");
}
return false;
}

Answer 3

楼主说的 让我想到了spring的MVC中的一个控制器AbstractWizardFormController
具体解决办法见
http://blog.csdn.net/daryl715/article/details/1647870