Rails 3 Jquery验证插件

Question

我有这个js代码

$(".new_milestone").validate({
     submitHandler: function(form) {
    $(form).submitWithAjax();
   },
     errorPlacement: function(error, element) {
        error.insertBefore(element);
     }
   });  

一切正常，errorPlacement和submitWithAjax函数。 但是，当我第二次发布表单而不重新加载页面时，该表单被发布了两次。 下次3次，依此类推。

当我这样做时

 $(".new_milestone").validate({
             errorPlacement: function(error, element) {
                error.insertBefore(element);
             }
           });
$(".new_milestone").submitWithAjax(); 

它可以工作，但是即使表单无效，它也可以执行ajax发布。

SubmitWithAjax函数如下所示（感谢Ryan Bates）

jQuery.fn.submitWithAjax = function() {
  this.submit(function() { 

    $.post(this.action, $(this).serialize(), null, "script");
    $('.spinning').show(); 
    $("#dialog_form").dialog("close")
    return false;
  })
  return this;
};

有任何停止这种行为的想法吗？

Answer 1

发生这种情况是因为您的ssubmitWithAjax函数实际上并未*提交（触发事件），它会在submit发生时（正常行为正在执行） 附加一个提交处理程序 ...因为您是在提交中调用它在这种情况下，只需删除处理程序包装并实际提交即可，如下所示：

jQuery.fn.submitWithAjax = function() {
  $.post(this.attr("action"), this.serialize(), null, "script");
  $('.spinning').show(); 
  $("#dialog_form").dialog("close")
  return false;
};

注意.attr("action")更改，因为this不是jQuery对象，也不是<form> DOM元素，因为它直接在插件中。

---

以前，你在安装一个附加 submit每次处理程序，这就是为什么你会得到1，2，3 ....提交，通过只调用提交你想要的代码，这将不会发生，因为里面submitHandler是有效的地方继续进行提交。

$.post() ， $.post()的回调函数是可选的，因此您可以省略该null,它将正常运行。