jquery - 为什么 JQuery Form SubmitHandler 不刷新其回调？

Question

我正在使用JQuery Form Plugin ，JQuery validation plugin和 jqTransform 插件。

我有一个隐藏的表单，我可以通过它来添加或编辑内容。编辑或添加操作会触发下一个函数调用。

function activateAddForm(formId,callback) {
    $('#'+formId).jqTransform().validate({
            submitHandler: function(form) {
                $(form).ajaxSubmit( {
                    dataType: "json", 
                    success: function(json) {
                        callback(json);
                    }
                });                 
            }
        }); 
}

每次调用都有不同的参数。对于添加，我用

来调用它

activateAddForm('add-new-form',addToy);

为了编辑，我称之为

activateAddForm('add-new-form',editToy);

这就是发生的事情:

• 重新加载页面。
• 编辑一个玩具。
• 提交表单。
• 调用 editToy 函数。
• 尝试添加一些内容。
• 使用 addToy 作为回调调用函数 activateAddForm，但一旦提交表单，就会调用 editToy 函数。

如果我在重新加载后做的第一件事就是添加一个玩具。然后addToy函数总是被调用。

我尝试添加:

function activateAddForm(formId,callback) {
    $('#'+formId).ajaxFormUnbind();
    ...
}

或

function activateAddForm(formId,callback) {
    $('#'+formId).resetForm();
    ...
}

但是它没有起作用。知道我能做什么吗？

解决方法试验

Activa 建议添加以下行:

$.removeData($('#'+formId)[0],'validator');

function activateAddForm(formId,callback) {
$('#'+formId).jqTransform();
$.removeData($('#'+formId)[0],'validator');
$('#'+formId).validate({
        submitHandler: function(form) {
            $(form).ajaxSubmit( {
                dataType: "json", 
                success: function(json) {
                    callback(json);
                }
            });                 
        }
    }); 
}

导致下一个:

• 重新加载页面。
  • 编辑一个玩具。
  • 提交表单。
  • 调用 editToy 函数。
  • 尝试添加一些内容。
  • 调用表单 editToy 函数，然后调用 add 函数。

上述修复不起作用，但似乎方向正确。

还有更多想法吗？

Answer 1

我认为如果你只改变验证器的submitHandler而不是把它放在验证函数的参数中会简单得多。

$('#form').validate().settings.submitHandler = function () {
   // your function goes here.
}
$('#form').submit();