Bootstrap Validator を使用して、2 つの「col-md」クラスに分割されたフォームを検証しようとしています。
1 つ目は .col-md-8 内に保持され、2 つ目は .col-md-3 内に保持されます。
検証は .col-md-8 のもので機能していますが、.col-md-3 では何も検証されていません。
動作している以前のものからのコピーであるため、Bootstrap バリデーターの構文が正しいことはわかっています。
誰もこれを経験したことがありますか？
<div class="form-group">
<label for="number">House Number</label>
<input class= "form-control" style="width:30%;" type="text" name="number" placeholder="e.g. 2a">
</div>
バリデータ JavaScript:
$('#multiform')
.find('[name="list_type"]')
.change(function(e) {
$('#multiform').bootstrapValidator('revalidateField', 'price');
})
.end()
.bootstrapValidator({
message: 'This value is not valid',
feedbackIcons: {
required: 'fa fa-asterisk',
valid: 'glyphicon glyphicon-ok',
invalid: 'glyphicon glyphicon-remove',
validating: 'glyphicon glyphicon-refresh'
},
fields: {
price: {
validators: {
notEmpty: {
message: 'The price is required and cannot be empty'
},
integer: {
message: 'You can only enter an integer'
},
regexp: {
regexp: /^[0-9]+$/,
message: 'The price can only consist of numbers'
}
}
},
title: {
validators:{
notEmpty: {
message:'This field cannot be empty'
},
regexp: {
regexp: /^[a-zA-Z0-9]+$/,
message: 'The title can only consist of letters and numbers'
}
}
},
desc: {
validators:{
notEmpty: {
message: 'This field cannot be empty'
},
stringLength: {
max: 500,
message: 'Your description is too long'
},
regexp: {
regexp: /^[a-zA-Z0-9#*]+$/,
message: 'The house number can only consist of letters and numbers'
}
}
},
number: {
validators:{
notEmpty: {
message: 'This field cannot be empty'
}
}
}
}
});
(上記のコードでは、検証されていない番号です。