jQuery验证插件不验证的形式$ .validate（）

我有一个页面，已成功使用jQuery验证插件来验证几个文本字段。有几个提交页面上的按钮，我已经配置如下验证：

_validator = $("#ftsEditTripForm").validate({ 
    onkeyup: false, 
    submitHandler: function() {} 
});

我注册下列click事件处理程序在页面上所有提交按钮：

function clickHandler(jqEvent) { 
    var action = jqEvent.target.id; 
    if (action !== "cancel") { 
     _form$.validate(); 
     if (_validator.numberOfInvalids() === 0) { 
      submitForm(action); 
     } 
    } else { 
     confirmCancel(action); 
    } 
} 
function submitForm(action) { 
    $(".flowEvent").attr("name", "_eventId_" + action); 
    if (action === "submit") { 
     $("input[name=status]").val("S"); 
    } else { 
     $("input[name=status]").val("D"); 
    } 
    _form$[0].submit(); 
}

这有一直工作正常。直到用户点击其中一个提交按钮，才会进行验证，如果该按钮是“取消”按钮，则会要求用户确认他们希望在实际提交页面之前丢失对该页面所做的任何更改。因此，如果用户单击“取消”按钮，然后单击“否”按钮，表示他们不想继续取消操作，我们将停止提交页面。

现在我已经将选项卡添加到导航栏中，并且如果用户单击其他选项卡以外的选项卡，则需要执行同样的操作。该标签被实现为div的，并且我已经定义了以下点击事件处理这些div：

function tabClickHandler(jqEvent) { 
    var target = jqEvent.target; 
    while (! $(target).hasClass("navTab")) { 
     target = target.parentNode; 
    } 
    var tabNumber = target.dataset.tabnumber; 
    _form$.validate(); 
    if (_validator.numberOfInvalids() === 0) { 
     $("input[name=tabNumber]").val(tabNumber); 
     submitForm("navbar"); 
    } 
}

我的问题是，当我点击一个选项卡上_validator.numberOfInvalids（）总是返回0。我在我的验证代码中放置了一个断点，当我单击一个选项卡时，它不会被调用。因此，即使存在验证错误，也始终提交该页面。

我已经尝试了一些东西 - 用于验证插件的onsubmit和submitHandler选择不同的值，改变标签的div到按钮 - 没有成功。

我希望有人能指出我正确的方向。我必须以这种或那种方式工作，并且我想继续使用验证插件。

感谢您阅读这篇文章。

Thom

来源

2014-03-05 Thom

这是什么？

_form$.validate();

我从来没有见过

你应该知道，.validate()方法仅用于初始化窗体上的插件命名为这样的（_form$）变量。

function clickHandler(jqEvent) { 
    var action = jqEvent.target.id; 
    if (action !== "cancel") { 
     _form$.validate(); 

    ....

所以，如果你没有初始化它，直到你点击按钮后，那么你将不会有任何验证。

通常情况下，.validate()仅在DOM准备好事件处理程序中调用一次，被捕获click事件是自动。您不能多次调用.validate()，因为所有后续实例都被忽略。

由于您有一个要忽略的cancel按钮，如果按下取消按钮，则可以使用.rules('remove')方法有效取消验证。事情是这样的......

$('#myCancelButton').on('click', function(e) { 
    e.preventDefault(); 
    $('input, select, textarea').each(function() { 
     $(this).rules('remove'); // remove all rules 
    }); 
    // something to do on cancel 
    confirmCancel(action); 
});

来源

2014-03-07 23:50:13 Sparky

jQuery验证插件不验证的形式$ .validate（）

回答

相关问题