我正在尝试进行自己的自定义表单验证。我想维护一个状态数组,每个字段都有自己的键:值(值是“好”或“坏”)。当数组包含“坏”时,我想禁用提交按钮。
错误/成功消息在每个字段旁边工作(我的 ajax 工作正常),但我无法禁用提交按钮。
$(function() {
// Custom Validation
var statusArray = {
'email' : 'good',
'passC' : 'good',
'pass1' : 'good',
'pass2' : 'good'
}
$("#email").blur(function() {
var form_data = {email: $("#email").val()}
$.ajax({
url: "<?= base_url('lounge/validation/email'); ?>",
type: 'POST',
data: form_data,
success: function(msg) {
if (msg['status'] == false){
$('#email_status').html('<span class="lounge_error">'+msg['message']+'</span>');
statusArray['email'] = 'bad';
}
else {
$('#email_status').html('<span class="lounge_okay">'+msg['message']+'</span>');
statusArray['email'] = 'good';
}
}
});
statusCheck();
return false;
})
// Password fields validation
$('#change_password').change(function () {
if ($(this).attr("checked")) {
$('#current_password_status').html('').css({"display": "inline-block"});
$('#new_password1_status').html('').css({"display": "inline-block"});
$('#new_password2_status').html('').css({"display": "inline-block"});
$("#current_password").blur(function() {
var form_data = {password: $("#current_password").val()}
$.ajax({
url: "<?= base_url('lounge/validation/password'); ?>",
type: 'POST',
data: form_data,
success: function(result) {
if (result['status'] == false){
$('#current_password_status').html('<span class="lounge_error">'+result['message']+'</span>');
statusArray['passC'] = 'bad';
}
else {
$('#current_password_status').html('<span class="lounge_okay">'+result['message']+'</span>');
statusArray['passC'] = 'good';
}
}
});
statusCheck();
return false;
});
$("#new_password1").blur(function() {
var form_data = {pass1: $("#new_password1").val()}
$.ajax({
url: "<?= base_url('lounge/validation/newpass1'); ?>",
type: 'POST',
data: form_data,
success: function(result) {
if (result['status'] == false){
$('#new_password1_status').html('<span class="lounge_error">'+result['message']+'</span>');
statusArray['pass1'] = 'bad';
}
else {
$('#new_password1_status').html('<span class="lounge_okay">'+result['message']+'</span>');
statusArray['pass1'] = 'good';
}
}
});
statusCheck();
return false;
});
$("#new_password2").blur(function() {
var form_data = {pass2: $("#new_password2").val()}
$.ajax({
url: "<?= base_url('lounge/validation/newpass2'); ?>",
type: 'POST',
data: form_data,
success: function(result) {
if (result['status'] == false){
$('#new_password2_status').html('<span class="lounge_error">'+result['message']+'</span>');
statusArray['pass2'] = 'bad';
}
else {
$('#new_password2_status').html('<span class="lounge_okay">'+result['message']+'</span>');
statusArray['pass2'] = 'good';
}
}
});
statusCheck();
return false;
});
} else {
$('#current_password_status').html('').css({"display": "none"});
$('#new_password1_status').html('').css({"display": "none"});
$('#new_password2_status').html('').css({"display": "none"});
}
});
});
function statusCheck() {
var status = [];
$.each(statusArray, function(key, value) {
status.unshift(value);
});
if ($.inArray('bad', status) == '-1') {
$("button[type=submit]").removeAttr("disabled");
} else {
$("button[type=submit]").attr("disabled", true);
}
}