如何解决验证 JS 错误消息在 select2 下拉列表中的 Bootstrap 模式上不清楚
验证不适用于 Bootstrap 模型,不允许提交按钮,并且在从下拉列表中选择值并提交表单后错误消息也不清楚。 附上模型图片供参考。
这里是通用验证函数。对 resetControls
函数进行了更改,但它不起作用。
'use strict';
$(document).ready(function () {
validate.extend(validate.validators.datetime,{
parse: function(value,options) {
return +moment.utc(value);
},// Input is a unix timestamp
format: function(value,options) {
var format = options.dateOnly ? "DD/MM/YYYY" : "DD/MM/YYYY";
return moment.utc(value).format(format);
}
});
var adminTeachertiMetableConstraints = {
teacherDropdown: {
presence: true,},studentDropdown:{
presence: true,bookedDateDropdown:{
presence: true,};
// Hook up the form so we can prevent it from being posted
var form = document.querySelector("form#rescheduleBooking");
form.addEventListener("submit",function(ev) {
ev.preventDefault();
handleFormSubmit(form);
});
// Hook up the inputs to validate on the fly
var inputs = document.querySelectorAll("input,textarea,select");
for (var i = 0; i < inputs.length; ++i) {
inputs.item(i).addEventListener("change",function(ev) {
resetControls(inputs);
var errors = validate(form,adminTeachertiMetableConstraints) || {};
generateMessage(errors,this);
});
}
function handleFormSubmit(form,input) {
var errors = validate(form,adminTeachertiMetableConstraints);
if(typeof(errors) === 'undefined'){
$(form).trigger('submit');
}
generateMessage(errors,input);
}
function generateMessage(errors,input){
$.each(errors,function(input,error){
$.each(error,function(index,msg){
addError(input,msg);
});
});
}
function addError(input,error) {
var block = document.createElement("p");
block.classList.add("text-danger");
block.classList.add("error");
block.innerText = error;
$("#"+input).nextAll("span.messages:last-child").html(block);
}
function resetControls(inputs){
$.each(inputs,input){
$(input).nextAll("span.messages:last-child").html("");
});
}
});
我该如何解决。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。