jQuery验证 - 如何使用像表单一样的向导中的步骤？

我想用jQuery Validation Plugin和jQuery UI Tabs。我如何使用jQuery Validation Plugin验证下一个按钮触发的每一步。我看到jQuery Validation Plugin的例子，主要是用于整个表单的验证。我需要一步一步来。jQuery验证 - 如何使用像表单一样的向导中的步骤？

我不是专业人士，所以请告诉我一些简单的解决方案，而不是建议我其他插件。我的代码看起来像：

$("#frag1").click(function(){ 
    //I need jQuery Validation code here for a single step 
    event.preventDefault(); 
}else { 
$('.next-tab, .prev-tab').click(function() { 
     $tabs.tabs('select', $(this).attr("rel")); 
     return false; 
    }); 
}

在此先感谢。

来源

2011-11-11 Imran

我认为你只使用一种形式。因此，请调用http://docs.jquery.com/Plugins/Validation/Validator/element#element并将当前碎片的验证代码添加到下一个按钮单击事件中。检查所有其他方法。知道你可以用这个解决方案。我是验证插件的新手。 –

我意识到你不希望其他插件的建议。但我认为这可能对您特别有用：

有jQuery的formwizard插件，http://thecodemine.org/

与jQuery的验证插件很好地集成。同时也是jQuery-UI主题的主题（如果您已经在您的网站上使用它们）。

来源

2011-11-11 12:12:44

如何为使用该插件的每个步骤制作选项卡？就像我在我的网站上使用的，请参阅上面的链接。 – Imran

更好的选择移动这个插件..它似乎更多的功能默认。无需编写代码。 –

嗨@伊姆兰你是对的我不认为你可以很容易地使用像向导这样的选项卡作为formwizard，但是像纳迦说formwizard带有很多功能，所以你可能希望使用formwizard，因为它可能会有其他功能可能会有用。 –

在下一步按钮单击检查哪个片段div没有“ui-tabs-hide”这个css类。然后尝试为所有输入和复选框应用相同的CSS类（例如： - “myinputs”），并且很快。然后应用当前“片段”div输入验证的验证。

例如： - 如果我在步骤2中。那么这个div“fragment-2”将不会有css类“ui-tabs-hide”。你可以看到这个班级适用于其他潜水。

因此，尝试获取当前的活动div ID（这里是“fragment-2”）。然后做这样的

http://docs.jquery.com/Plugins/Validation/Validator/element#element

$("#myform").validate().element("#myselect"); // here there are passing element ID 

$("#myform").validate().element('#'+ CurrentFragment + '.myinputs'); //here we are passing current fragment css class inputs.

我不知道它会接受CSS类。但尝试一次循环，并处理假元素和return false没有任何一步。因此，用户不会移动到下一个片段，直到他设置了值。

我不确定这是最好的主意。我对这个验证插件没有太多的知识。

来源

2011-11-11 12:40:07

jQuery验证 - 如何使用像表单一样的向导中的步骤？

回答

相关问题