Проверка ввода массива с использованием модуля проверки правильности jquery
У меня есть следующий вид. Я пытаюсь проверить входные данные с помощью плагина проверки jquery. Я пробовал некоторые коды, но не работал. Когда я нажимаю кнопку "Отправить", она просто переходит к созданию действия.
<form name="voucherform" action="something" method="post">
<input type="text" name="reg_number[]" value="" />
<input type="text" name="reg_number[]" value="" />
<input type="text" name="reg_number[]" value="" />
<input type="submit" name="submit" value="submit" />
Не могли бы вы показать мне, как проверить форму выше, используя плагин проверки правильности jquery?
Спасибо:)
Мой код JQuery:
<script type="text/javascript" src="<?php echo base_url();?>support/datepicker/js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="<?php echo base_url();?>support/js/jquery.validate.js"></script>
<script>
$(document).ready(function() {
// validate signup form on keyup and submit
var validator = $("#voucherform").validate({
showErrors: function(errorMap, errorList) {
$(".errormsg").html($.map(errorList, function (el) {
return el.message;
}).join(", "));
},
wrapper: "span",
rules: {
reg_number[]: {
required: true,
minlength: 2,
remote: {
url: '<?php echo base_url();?>sales/invoice_check', async: false,
type: 'post'
},
}
},
messages: {
reg_number[]: {
required: "Enter Reg Number",
minlength: jQuery.format("Enter at least {0} characters"),
remote: jQuery.format("{0} is already in use")
},
}
});
});
</script>
Ответы
Ответ 1
У вас есть две проблемы:
-
Вы не выбираете элемент form
правильно.
Вы ищете form
с id
"voucherform", а ваша разметка не содержит. Вероятно, вы хотите изменить свой селектор на:
$("form[name='voucherform']").validate({ ... });
-
Скобки ([]
) недействительны в JavaScript-идентификаторах. Это означает, что ваш script не обрабатывается правильно. Чтобы разрешить это, просто оберните те поля, у которых есть скобки в них в кавычках, т.е. 'reg_number[]'
вместо reg_number[]
.
Измененный код проверки:
var validator = $("form[name='voucherform']").validate({
showErrors: function(errorMap, errorList) {
$(".errormsg").html($.map(errorList, function(el) {
return el.message;
}).join(", "));
},
wrapper: "span",
rules: {
'reg_number[]': {
required: true,
minlength: 2,
remote: {
url: '<?php echo base_url();?>sales/invoice_check',
async: false,
type: 'post'
}
}
},
messages: {
'reg_number[]': {
required: "Enter Reg Number",
minlength: jQuery.format("Enter at least {0} characters"),
remote: jQuery.format("{0} is already in use")
}
}
});
Пример: http://jsfiddle.net/hfrhs/
Ответ 2
Я нашел лучший ответ здесь
fooobar.com/questions/438382/...
если имена ваших элементов имеют индексы, они рассматриваются как уникальные имена
req_number [0]
req_number [1]
ЭСТ....
Ответ 3
Здесь вы можете найти хороший ответ: jquery-validation-for-array-of-input-elements. В 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();
}
Ответ 4
вот мой путь
'reg_number[]':{
required:function(){
return $("input[name='reg_number[]']").filter(function(){
return $.trim($(this).val()).length>0
}).length==0
}
}
Надеюсь, это мало поможет вам.
Ответ 5
Просто поделитесь методом проверки флажка с индексом, и только один из них является обязательным.
<input type="checkbox" value="0" name="is_appraisal[0]" class="is_appraisal_f siblingcheckbox" id="is_appraisal_f">
<input type="checkbox" value="1" name="is_appraisal[1]" checked="checked" class="is_appraisal_s siblingcheckbox" id="is_appraisal_s">
Проверка Jquery для этого:
$.validator.addMethod("onechecked", function (value, elem, param) {
if ($(".siblingcheckbox:checkbox:checked").length > 0) {
return true;
} else {
return false;
}
}, "You must select at least one!");
$.validator.addClassRules("siblingcheckbox", {
onechecked: true
});