【发布时间】:2019-08-18 04:59:15
【问题描述】:
我有这样的脚本:
const add_modal = $('#add_modal');
const add_form = $('#add_form');
const add_button = $('#add_button');
const save_button = $('#save_button');
let add_validator = add_form.validate({
ignore: 'input[type=hidden], .select2-search__field', // ignore hidden fields
errorClass: 'validation-invalid-label',
highlight: function(element, errorClass) {
$(element).removeClass(errorClass);
},
unhighlight: function(element, errorClass) {
$(element).removeClass(errorClass);
},
// Different components require proper error label placement
errorPlacement: function(error, element) {
// Unstyled checkboxes, radios
if (element.parents().hasClass('form-check')) {
error.appendTo( element.parents('.form-check').parent() );
}
// Input with icons and Select2
else if (element.parents().hasClass('form-group-feedback') || element.hasClass('select2-hidden-accessible')) {
error.appendTo( element.parent() );
}
// Input group, styled file input
else if (element.parent().is('.uniform-uploader, .uniform-select') || element.parents().hasClass('input-group')) {
error.appendTo( element.parent().parent() );
}
// Other elements
else {
error.insertAfter(element);
}
},
rules: {
name: {
required: true,
minlength: 2,
maxlength: 20
},
email: {
required: true,
email: true,
remote: "/admin/users/check-email",
},
role: {
required: true,
},
password: {
required: true,
minlength: 12,
},
password_verification: {
required: true,
minlength: 12,
equalTo: '#password'
},
},
messages:{
email:{
remote: "Email is already taken."
}
}
});
add_button.click(function (e) {
e.preventDefault();
add_modal.modal("show");
add_validator.resetForm();
$(':input').val("");
$("#csrf").val($csrf);
});
save_button.click(function (e) {
e.preventDefault();
let form = $(this).closest('form');
let $action = form.attr('action');
let $method = form.attr('method');
let $data = form.serialize();
if (add_form.valid()) {
$.ajax({
url: $action,
type: $method,
data:$data,
success: function (result) {
if (result.type === 'success') {
add_modal.modal("hide");
add_validator.resetForm();
swalInit({
title: 'Success!',
text: result.text,
type: 'success',
timer: 3000,
}).then((reload) => {
datatables.ajax.reload();
});
} else {
swalInit({
title: 'Oops...',
text: result.text,
type: 'error',
timer: 3000,
});
}
},
})
}
});
jqueryvalidation 插件似乎正在检查打开模式的邮件可用性。因为当我在 web 检查器上看到它时,它会向 /admin/users/check-email 发送一个发布请求。我怎样才能防止这种行为并让它只在我按下 save_button 时检查? save_button 是模态框内的一个按钮。
【问题讨论】:
-
你没有解释你想要做什么,也没有显示相关的渲染 HTML。我们无法通过查看您的 OP 来判断哪些按钮在模态中,哪些不在。
-
@Sparky jsfiddle.net/6hewjqro/3 这是我使用过的一些 HTML 和 JS。我希望当模态框内的按钮被点击时,它不会在模态框打开时被验证。
-
我真的认为你应该再看看the last question you asked。注意我的 cmets ......接受的答案是完全错误的 - 不应该使用
success处理程序。对提交表单时发生的任何 Ajax 使用submitHandler。 -
@Sparky 啊抱歉,刚刚在那里阅读了您的评论。但是你的意思是什么?我不明白。我想现在我知道该怎么做了,就像你说的那样,我会试试看。
-
假设我将我的 ajax 放在 submitHandler 中,我是否有必要像这样检查表单是否正确:if (add_form.valid()) { }?还是不再需要了?
标签: php jquery jquery-validate