如何使用validate plugin jqueryvalidation输入数组

我是jqueryvalidation插件的新手，但我想知道如何使用validation插件validation输入框数组。

下面是HTML代码。

和jquery代码如下

 jQuery("#transport-form").validate({ rules: { 'qty[]': { required: true } }, }); 

但每次我点击提交它只validation第一个值。 其余所有相同名称的值都未经过validation。 请帮忙。

Answer 1

有时我们需要validation输入元素数组：例如 –

 
  Select One aa bb cc dd   Select One ee ff gg hh   Select One ii jj kk ll    

现在我们将使用jqueryvalidation插件jquery.validate.js来validation表单。 条件是用户必须从每个下拉列表中选择类别。 validation脚本如下 –

现在的问题是现成的jquery.validate.js只validationcategory []的第一个元素。 所以，我们需要稍微修改一下。

在jquery.validate.js中，我们可以找到一个名为checkForm的函数，我们必须修改它如下：

 checkForm: function() { this.prepareForm(); for (var i = 0, elements = (this.currentElements = this.elements()); elements[i]; i++) { if (this.findByName(elements[i].name).length != undefined && this.findByName(elements[i].name).length > 1) { for (var cnt = 0; cnt < this.findByName(elements[i].name).length; cnt++) { this.check(this.findByName(elements[i].name)[cnt]); } } else { this.check(elements[i]); } } return this.valid(); } 

我刚刚从http://www.codeboss.in/web-funda/2009/05/27/jquery-validation-for-array-of-input-elements/获得了这个解决方案，希望这有助于某人https://stackoverflow.com/questions/24670447/how-to-validate-array-of-inputs-using-validate-plugin-jquery/...

Answer 2

您可以传递一个选项来忽略字段名称的一部分; 至于原始post评论，有很多用例在HTML中使用name []样式名称，特别是使用PHP。

 $("#my-form").validate({ submitHandler: function(form) { form.submit(); }, ignore: [], rules: { 'category[]': { required: true } } }); 

Answer 3

我注意到我使用的jQuery validate插件只会检测具有特定名称的第一个元素。

制作jQuery validate插件的另一种方法是检测除第一个之外的所有输入都可以通过使名称唯一。 所以你可以替换：

有：

Answer 4

这是我发现的最佳解决方案，我目前在我的项目中使用：

 // Adding rule to each item in qtyi list jQuery('[id^=qty]').each(function(e) { jQuery(this).rules('add', { minlength: 2, required: true }); }); 

Answer 5

您需要为每个元素建立索引

下面是HTML代码。

和jquery代码如下

 jQuery("#transport-form").validate({ rules: { 'qty[]': { required: true } }, }); 

Answer 6

首先，让jQuery区分每个元素需要不同id的元素。 添加输入时，可以通过编程方式完成此操作。 那么您需要做的是立即validation具有通用名称的所有输入。 为此，使用addMethod（）函数创建自定义validation器，如文档中所述

 jQuery.validator.addMethod("allRequired", function(value, elem){ // Use the name to get all the inputs and verify them var name = elem.name; return $('input[name="'+name+'"]').map(function(i,obj){return $(obj).val();}).get().every(function(v){ return v; }); }); 

您可以将其用作数组元素的规则：

 $('form').validate( { rules: { "nbPieces[]": "allRequired" }, submitHandler : function(form, event) { event.preventDefault(); //https://stackoverflow.com/questions/24670447/how-to-validate-array-of-inputs-using-validate-plugin-jquery/... etc } }); 

为了使错误在空字段上正确显示，您可能需要覆盖来自validate的errorPlacement选项https://stackoverflow.com/questions/24670447/how-to-validate-array-of-inputs-using-validate-plugin-jquery/…

Answer 7

这里的解决方案没有给数组索引。

 
 
Name: 
  
 
    

js代码

 $(document).ready(function () { $.validator.addMethod("mytst", function (value, element) { var flag = true; $("[name^=name_ct]").each(function (i, j) { $(this).parent('p').find('label.error').remove(); $(this).parent('p').find('label.error').remove(); if ($.trim($(this).val()) == '') { flag = false; $(this).parent('p').append('This field is required.'); } }); return flag; }, ""); $("form").validate({ ignore: '', rules: { "name_ct[]": { mytst:true } }, submitHandler: function () { //you can add code here to recombine the variants into one value if you like, before doing a $.post form.submit(); alert('successful submit'); return false; } }); var j = 1; $('input[type="button"]').click(function () { $('form div').append('
'); j++; }); }); 

你可以在这里看到js小提琴： https ： //jsfiddle.net/q0d76aqx/42/

Answer 8

我使用过AsgarAli Khanusiya提出的解决方案，但JQuery.Validator在错误的地方显示带有错误信息的标签。 这是因为它存储了以前显示的消息。 如果用户对集合中的不同项目犯了同样的错误，则validation器会在之前的位置显示标签，而不是在有问题的元素附近生成新标签。 我已经覆盖了’errorsFor’方法来解决这个问题：

 $.validator.prototype.errorsFor = function (element) { var name = this.idOrName(element); var elementParent = element.parentElement; return this.errors().filter(function() { return $(this).attr('for') == name && $(this).parent().is(elementParent); }); } 

Answer 9

jQuery Form Validator是一个function丰富的多语言jQuery插件，可以轻松validation用户输入，同时保持HTML标记从javascript代码中清除。 尽管这个插件具有广泛的validationfunction，但它的设计要求尽可能少的jQuery网络流量。 这是通过将“模块”中的validationfunction组合在一起来实现的，从而可以仅加载validation特定表单所需的那些function。

 
 
 E-mail  
 
 User name  
 
 Password  
 
 Repeat password  
 
 Birth date  
 
 Country  
 
 Profile image  
 
 User Presentation (100 characters left)  
 
  I agree to the terms of service 
 
   
 
    https://stackoverflow.com/questions/24670447/how-to-validate-array-of-inputs-using-validate-plugin-jquery/...