I have this file that validate and submit jQuery smart wizard form, I don't know what is wrong with my code but it give me maximum call stack size exceeded, when I'm sending an AJAX POST request.
All previous question here have not been of help. Below is the code. I really need help and thanks in advance.
$(document).ready(function() {
var error = false;
var fnError = false;
var lnError = false;
var dobError = false;
var genError = false;
var phoneErr = false;
var isValid = true;
var id = $("#session_id");
var activation = $("#session_activation");
var firstname = $("#firstname");
var lastname = $("#lastname");
var dob = $("#dob");
var select_gender = $("#select_gender");
var location = $("#location");
var descr = $("#desc_txt");
// event listeners
$("#btn_name_next").hide();
$("#btn_info_next").hide();
$("#btn_final").hide();
if ($("#first")) {
$("#lastname").keyup(function() {
$("#btn_name_next").show();
validateStep1();
cleanError();
});
}
if ($("#second")) {
$("#select_gender").change(function() {
$("#btn_info_next").show();
validateStep2();
cleanError();
});
}
$("#form_details").submit(function(e) {
e.stopPropagation();
e.preventDefault();
var u_id = id.val();
var active = activation.val();
var f_name = firstname.val();
var l_name = lastname.val();
var date_of_birth = window.dob; //this variable is from function to convert date
var gender = select_gender.val();
var phone_num = window.phone; //this variable is from firebase auth
var photo_url = window.foo; //this variable is from firebase storage
var user_address = location.val();
var user_desc = descr.val();
var url = $(this).attr("action");
var btn_final = $("#btn_final");
$.post('url', {
user_id: u_id,
acc_active: active,
user_fname: f_name,
user_lname: l_name,
user_dob: date_of_birth,
user_gender: gender,
user_phoneNumber: phone_num,
user_pic: photo_url,
address: user_address,
user_about: user_desc,
btn_final: btn_final
}, function(response) {
console.log(response);
})
});
function validateStep1() {
if (firstname.val() == "" || firstname.val().length <= 1) {
$("#fn_info").html(`<small class="text-danger">Please enter your first name</small>`);
error = true;
fnError = true;
} else {
return error;
return fnError;
}
if (lastname.val() == "" || lastname.val().length <= 1) {
$("#ln_info").html(`<small class="text-danger">Please enter your last name</small>`);
error = true;
lnError = true;
} else {
return error;
return lnError;
}
return isValid;
}
function validateStep2() {
if (dob.val() == "") {
$("#dob_info").html(`<small class="text-danger">Please enter your your date of birth</small>`);
error = true;
dobError = true;
} else {
var bdate = dob.val();
var date = new Date(bdate.replace(/(\d{2})-(\d{2})-(\d{4})/, "$1/$2/$3"));
window.dob = date;
console.log(date);
return error;
return dobError;
}
if (select_gender.val() == $("#opt")) {
$("#gen_info").html(`<small class="text-danger">Please chose a gender</small>`);
error = true;
genError = true;
} else {
return error;
return genError;
}
return isValid;
}
function cleanError() {
if (error == true) {
if (fnError == true) {
$("#firstname").keyup(function() {
$("#fn_info").hide();
})
}
if (lnError == true) {
$("#lastname").keyup(function() {
$("#ln_info").hide();
})
}
if (dobError == true) {
$("#dob").change(function() {
$("#dob_info").hide();
})
}
if (genError == true) {
$("#select_gender").change(function() {
$("#gen_info").hide();
})
}
if (phoneErr == true) {
$("#phone").keyup(function() {
$("#phone_info").hide();
})
}
}
}
});