My contact form was working perfectly fine until recently when it suddenly stopped allowing me to send messages. I keep encountering this error message every time I try to submit the form:
Uncaught TypeError: Failed to construct 'FormData': parameter 1 is not of type 'HTMLFormElement'. at submitForm (ajax.js:77) at HTMLFormElement. (ajax.js:72) at HTMLFormElement.dispatch (jquery-3.3.1.js:5183) at HTMLFormElement.elemData.handle (jquery-3.3.1.js:4991)
$(document).ready(function() {
$("#subscribeForm").validator().on("submit", function (event) {
if (event.isDefaultPrevented()) {
formError();
submitMSG(false, "Are you sure you filled form inputs correctly?");
} else {
event.preventDefault();
submitForm();
}
});
function submitForm(){
var subscribe_email =$("input[name=subscribe_email]").val();
var formData = new FormData($(this)[0]);
formData.append('subscribe_email', subscribe_email );
$.ajax({
url: "include/ajax/subscribe.php",
type: "POST",
contentType: false,
processData: false,
data: formData,
cache: false,
success : function(text){
if (text == "success"){
formSuccess();
} else {
formError();
submitMSG(false,text);
}
}
});
}
function formSuccess(){
$("#subscribeForm")[0].reset();
submitMSG("valid", "Your message was successfully sent");
}
function formError(){
submitMSG("invalid", "Something went wrong. Please, try again or contact with our support team.");
}
function submitMSG(valid, msg){
if(valid){
var msgClasses = "cf-alert alert success";
} else {
var msgClasses = "cf-alert alert warning";
}
$("#success_submit").removeClass().addClass(msgClasses).text(msg);
}
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>Can anyone help me figure out why my contact form suddenly started encountering this error? Any insights would be greatly appreciated. Thank you!