Question

我正在使用fuelux向导进行多步骤订单处理。我让wizrd工作得很好，但如果我将整个向导包装成一个表单，无论我尝试什么，它都会在我点击下一步时提交表单。

我尝试在按钮上添加type =“button”，这样就不会将它们视为提交按钮，并允许我以编程方式提交表单.on（'已完成'但是向导不会逐步完成这些步骤

我试过了：

 $('#fuelux-wizard').wizard().on('change' , function(e, info){
                e.preventDefault();
}

但是在记录了有问题的e之后它是'改变'所以我认为这是与向导而不是形式。

我的jquery / javascript知识和对事件等的理解还不足以解决这个问题，我被困住了。

替代方案似乎是在每个步骤中都有单独的表单，然后以某种方式将它们组合在一起，但是如果我可以控制提交，那么在单个表单中包装向导时，这似乎是非常复杂的，这看起来像是应该是可能的。

任何人都可以给我任何指示吗？

感谢。

Answer 1

我找到了解决方案。不确定它是否特别优雅但它有效。

因此，在初始化向导之前，我将preventDefault绑定到表单上的submit事件。

$('#order_form').on('submit',function(e){
                e.preventDefault();
            });

然后在wizrd init中，我将其绑定到'finished'事件中因此：

$('#fuelux-wizard').wizard().on('finished', function(e,data) {
                // allow order form to be submitted
                $('#order_form').unbind('submit');
                // submit order form
                $('#order_form').submit();
   });

任何人都建议一个更优雅的解决方案，或者看看我所做过的任何问题？

fuelux向导提交多个表单或一个表单包装？

1 个答案: