Jquery Validation 如何在一个错误中验证两个字段
How to validate two fields in one error in Jquery Validation
我有两个字段 date_start 和 date_end,我想在 jQuery Validate.
中验证这两个字段
我有两个来自验证器的错误,但我只需要一个...
java JSP 表格的一部分
<div class="form-group user-edit-form-group">
<label for="input_cameras_limit" class="col-xs-4 control-label">Cameras limit</label>
<div class="col-xs-4">
<input name="key_cameras_limit" id="input_cameras_limit" type="text"
class="form-control user-edit-input" placeholder="" value="">
</div>
<div class="user-edit-error-wrapper">
</div>
</div>
JS 验证部分
$('#partner_key_settings_form').validate({
rules: {
key_valid_from: {
required: true,
date: true
},
key_valid_till: {
required: true,
date: true
}
},
messages: {
key_valid_from: {
required: JsMultiLang.getWords('partner', 'validationPromoCodeDate')
},
key_valid_till: {
required: JsMultiLang.getWords('partner', 'validationPromoCodeDate')
}
},
errorClass: "user-search-error",
errorPlacement: function (error, element) {
if (element.attr("name")=="key_valid_from" ||element.attr("name")=="key_valid_till"){
error.appendTo($(element).parent().parent().parent().find('.user-edit-error-wrapper'));
console.log(error.appendTo($(element).parent().parent().parent().find('.user-edit-error-wrapper')==undefined))
}
},
highlight: function (element) {
$(".user-edit-server-error").remove();
$(element).closest('.form-group').addClass('has-error');
var tabPaneId = $(element).closest('.tab-pane').attr('id');
$('a[href="#' + tabPaneId + '"]').addClass('has-error');
},
unhighlight: function (element, error, valid) {
$(element).closest('.form-group').removeClass('has-error');
var tabPaneId = $(element).closest('.tab-pane').attr('id');
var hasErrorDivsId = '#' + tabPaneId + ' .has-error';
var errorDivsOnTabSize = $(hasErrorDivsId).size();
if (errorDivsOnTabSize < 1) {
$('a[href="#' + tabPaneId + '"]').removeClass('has-error');
}
},
success: function (error) {
error.remove();
}
})
您需要添加 group
object
用于对验证进行分组,如果需要,还需要添加 errorPlacement
。
rules: {
key_valid_from: {
required: true,
date: true
},
key_valid_till: {
required: true,
date: true
}
},
groups: {
key_valid_from: "key_valid_from key_valid_till"
},
errorPlacement: function(error, element) {
if (element.attr("name") == "key_valid_from" || element.attr("name") == "key_valid_till")
error.insertAfter('input[name=key_valid_till]');
else
error.insertAfter(element);
}
我有两个字段 date_start 和 date_end,我想在 jQuery Validate.
中验证这两个字段我有两个来自验证器的错误,但我只需要一个...
java JSP 表格的一部分
<div class="form-group user-edit-form-group">
<label for="input_cameras_limit" class="col-xs-4 control-label">Cameras limit</label>
<div class="col-xs-4">
<input name="key_cameras_limit" id="input_cameras_limit" type="text"
class="form-control user-edit-input" placeholder="" value="">
</div>
<div class="user-edit-error-wrapper">
</div>
</div>
JS 验证部分
$('#partner_key_settings_form').validate({
rules: {
key_valid_from: {
required: true,
date: true
},
key_valid_till: {
required: true,
date: true
}
},
messages: {
key_valid_from: {
required: JsMultiLang.getWords('partner', 'validationPromoCodeDate')
},
key_valid_till: {
required: JsMultiLang.getWords('partner', 'validationPromoCodeDate')
}
},
errorClass: "user-search-error",
errorPlacement: function (error, element) {
if (element.attr("name")=="key_valid_from" ||element.attr("name")=="key_valid_till"){
error.appendTo($(element).parent().parent().parent().find('.user-edit-error-wrapper'));
console.log(error.appendTo($(element).parent().parent().parent().find('.user-edit-error-wrapper')==undefined))
}
},
highlight: function (element) {
$(".user-edit-server-error").remove();
$(element).closest('.form-group').addClass('has-error');
var tabPaneId = $(element).closest('.tab-pane').attr('id');
$('a[href="#' + tabPaneId + '"]').addClass('has-error');
},
unhighlight: function (element, error, valid) {
$(element).closest('.form-group').removeClass('has-error');
var tabPaneId = $(element).closest('.tab-pane').attr('id');
var hasErrorDivsId = '#' + tabPaneId + ' .has-error';
var errorDivsOnTabSize = $(hasErrorDivsId).size();
if (errorDivsOnTabSize < 1) {
$('a[href="#' + tabPaneId + '"]').removeClass('has-error');
}
},
success: function (error) {
error.remove();
}
})
您需要添加 group
object
用于对验证进行分组,如果需要,还需要添加 errorPlacement
。
rules: {
key_valid_from: {
required: true,
date: true
},
key_valid_till: {
required: true,
date: true
}
},
groups: {
key_valid_from: "key_valid_from key_valid_till"
},
errorPlacement: function(error, element) {
if (element.attr("name") == "key_valid_from" || element.attr("name") == "key_valid_till")
error.insertAfter('input[name=key_valid_till]');
else
error.insertAfter(element);
}