如何使用ajax请求进行多页表单提交

Question

该应用程序是在第一页客户填写信息的地方运送物品。然后在第 2 页，他可以选择不同的费率选项。然后在第三页，他需要填写地址信息。然后在第 4 页付款信息等。

现在假设客户在第一页输入详细信息。我向服务器发送 ajax 请求并获得不同的费率选项。 一旦我回到 ajax 成功，我需要将页面更改为 2nd jsp。一旦客户选择费率选项，然后再次发出 ajax 请求并获得第三个 jsp 等等。

我需要在不重新加载或重定向页面的情况下实现代码的 UI 端。同样从第 2 和第 3 jsps 开始，我应该有一个后退按钮可以转到上一页。

是否可以仅使用 jquery 设置/替换 div 或者是否有任何插件可以使用，例如 twitter bootstrap carousel？

我需要一些关于 ajax 成功功能的帮助，以便我可以使用提交和返回按钮转到下一个或上一个 jsps？ 我正在使用 Spring MVC 框架。

Answer 1

我认为您对谁制造了什么有点困惑：您将 jsp 和 ajax、服务器端计算和客户端混合在一起。

不要关心jsp或spring。它们与你需要什么无关：你要实现一个单页应用程序，所以 jsp 和 spring 只会负责向客户端传递数据，例如以json（绑定到模板，请参阅 jsview）或 html（附加 dom 元素）。

客户在第一页输入详细信息，在提交时，会发生 ajax 调用。正如我上面所说，调用的响应将是绑定到您的文档的 json 或 html，所以现在您可以显示新数据并隐藏旧数据，使用引导轮播就可以了......等等其他页面。

对于后退按钮，如果您仅使用 html5 浏览器，则应操作浏览器历史记录 (https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Manipulating_the_browser_history)，否则应使用类似 history.js 的 polyfill (https://github.com/browserstate/history.js/)

此响应只是您需要做的事情的线索。 AngluarJS 或 ember.js 是另一个关键字，可用于搜索问题的解决方案。