Question

我正在构建一个4步表单，我只想验证当前可见的字段集。每个“步骤”都有一个提交按钮，所以我希望这些内容：

$('#step-1-button').on('click', function(e){
    $('#step-1-fieldset').validationEngine('validate', {
    onValidationComplete: function(form, status){
        if(status){ goToNextStep() });
    }
});

非常感谢任何帮助！

Answer 1

我不确定validationEngine插件的确切工作方式 - 但快速阅读文档表明您可以对单个元素调用'validate'操作，并且只验证可以使用jquerys Filter方法的可见字段集。

我会说像

$('#step-1-button').on('click',function(e) {
       e.preventDefault(); 
       var inputs = $('fieldset').filter(':visible').find('input');
       $.each(inputs,function() { 
            $(this).validationEngine('validate');
       });
});

会起作用。

当您按可见字段集过滤时，无论单击哪个按钮，您还可以将事件附加到通用选择器 - 类似于$（'.step-button'） - 这将阻止您必须单独编写4步表单中每个按钮的事件处理程序，有助于保持代码干燥。

Answer 2

另一种仅验证表单的一部分的方法是以编程方式添加和删除类，例如“required”。然后在“.required”字段上运行验证。在选中表单的四个步骤时，从所有元素中删除所需元素，然后仅重新应用于需要验证的可见元素。关于jquery验证插件的好处是你不需要在DOM更改时重新运行它，它会在更新时自动跟踪必需和非必需字段。

Answer 3

我认为在您的情况下使用 stepy form 进行验证并不错。它也支持ajax。
如步骤1,2,3 .. +验证这是你想要的 Demo

jQuery validationEngine：仅验证fieldset

3 个答案: