如何在DIV标记上使用jquery验证插件

Question

我有一个包含jquery选项卡等多个步骤的表单。我的目的是在单个选项卡中验证输入文本字段，然后用户才能转到下一个选项卡。在最后一个标签中，我想提交包含以前标签中所有数据的表单。

如何在DIV标签上使用jquery验证插件，以便我可以在单个表单中使用多个div标签，如何在每个div字段上验证输入文本？

谢谢

Answer 1

您可以使用自定义规则，并根据所选标签设置“有效”表单，例如：

div 1

• txtName的
• txtEmail

div 2

• txtAddress
• txtOther ...

配置如下：

var tab1Valid = false;
var tabNValid = false;

jQuery.validator.addMethod('Tab1Validator', isFirstTabValid, '*');
jQuery.validator.addMethod('Tab2Validator', isSecondTabValid, '*');
...

 $('#tabsForm').validate({
            onkeyup: false,
            submitHandler: onSaveHandler,
            rules: {
                txtName: { Tab1Validator: '' },
                txtEmail: { Tab1Validator: '' },
                txtAddress: { Tab2Validator: '' },
...
            }
        });

isFirstTabValid: function(value, element, params) {
// validate values accordign 'element' parameter
// return corresponding true/false  
    },

isSecondTabValid: function(value, element, params) {
      if (tab1Valid === false)  {
return true; // we dont need validate other fields if first tab is not valid.
}

// else validate 
    },

嗯，这样的事情。根据需要改变，主要想法在这里

Answer 2

您可以暂时放置表单并在获得成功后单独验证div，您可以再次删除该表单。