Question

我们有一个在叠加窗口中加载的表单。我们使用jQuery $.post来通过ajax发布，而不是默认的表单帖子，这样我们就可以在打开覆盖窗口的情况下保持当前页面。所以代码是这样的：

$('#submitForm').click(function(e){
    e.preventDefault();
    $.post('myPage.cfm', $('#myForm').serialize()); 
});

这样可以防止通过ajax发布默认帖子和帖子。

我们还使用jQuery validate插件验证表单。所以这是验证码：

$("#myForm").validate({
    rules: {
        numUnits: "number",
        pctBusiness: {
            number: true,
            range: [0, 100] 
        }
    }   
});

问题是，虽然验证插件正在验证焦点输出上的正确字段，但preventDefault代码和程序化ajax帖子阻止它在字段无效时阻止提交。我如何保留我的ajax帖子，但仍然可以启用验证？

Answer 1

使用valid()函数检查表单是否有效，然后发布表单数据

$('#submitForm').click(function(e){
    e.preventDefault();
    if($('#myForm').valid()){
        $.post('myPage.cfm', $('#myForm').serialize());
    }
});

另一种选择是使用提交处理程序

jQuery(function ($) {
    $('#form').validate({
        rules: {
            numUnits: "number",
            pctBusiness: {
                number: true,
                range: [0, 100]
            }
        },
        submitHandler: function () {
            //do the submit here
            alert('test');
            //$.post('myPage.cfm', $('#myForm').serialize());
        }
    });
});

Answer 2

使用Ajaxform

 $("#myForm").ajaxForm({ 
               success:  function (response, statusText, xhr, $form)
                 {// do validation here and  success msg
             },
       beforeSend: function(xhr){},
       complete: function(){},
       dataType:  'json'
       });

如何在禁用默认帖子时启用jQuery验证器？

2 个答案: