Backbone.js多步表单

Question

我希望在我的网站上为“即时报价”类型的内容制作一步一步的表格。我在photoshop上制作了以下图片，我希望用户在表格的每一步输入信息并最终在步骤3提交表格（进入下一步应该是无缝的，没有页面重新加载），这是非常不言自明的。 。

有人可以给我一些一般性的指示我应该怎么做？这是我使用backbone.js的第一个项目，这对于了解这个特定小部件的最佳方式是非常有帮助的。

由于

Answer 1

我会按如下方式构建它：

<强> 1。实施要收集的数据模型

拥有一个可以跨阶段收集数据的模型。实现此模型的存储，并允许部分完成的数据。 （您可能希望在每个阶段都存储它，因此用户可以在以后再回来。）

<强> 2。实施通用的“多阶段”视图

这应该负责在顶部渲染标签/阶段，向后/向前渲染导航元素，以及渲染子视图。

第3。为每个阶段实施特定的子视图

这些应该在上述模型的位上运行。

<强> 4。实施路由

您可能希望每个子视图使用不同的URL路由，或者您可能需要整个多阶段过程使用相同的URL。无论哪种方式，路由器都需要创建外部多阶段视图和内部子视图（或视图），并将它们与适当的模型一起连接在一起。

<强> 5。提示：使用pub / sub

不要紧紧地结合你的观点。使用某种形式的pub / sub来提升和收听自定义事件。 （例如：http://lostechies.com/derickbailey/2011/07/19/references-routing-and-the-event-aggregator-coordinating-views-in-backbone-js/）

Answer 2

除了stusmith，我刚刚做了一个主干js多步形式的例子。请随意查看并复制它。

https://github.com/michaelkoper/backbone-multistep-form