Tengo un proyecto donde tengo que insertar un formulario con https://formcarry.com/
La propia web del formulario facilita un código en jquery para enviar una respuesta al usuario si se ha enviado correctamente el formulario. Estoy intentando pasar ese código jquery a javascript vanilla, para no tener que utilizar jquery en el proyecto, y estoy teniendo problemas.
El código a convertir es el siguiente:
$(function(){
$(".ajaxForm").submit(function(e){
e.preventDefault();
var href = $(this).attr("action");
var enviado = $(".enviado")
$.ajax({
type: "POST",
dataType: "json",
url: href,
data: $(this).serialize(),
success: function(response){
if(response.status == "success"){
enviado.addClass("block");
}else{
alert("Error " + response.message);
}
}
});
});
});
El código que no me funciona es el siguiente:
var submitForm = document.querySelector('#submitForm')
function formcarry() {
var ajaxForm = document.querySelector('.ajaxForm')
ajaxForm.submit(function(e) {
e.preventDefault();
var href = ajaxForm.getAttribute('action')
var request = new XMLHttpRequest();
request.onreadystatechange = function() {
if(request.readyState === 4) {
if(request.status === 200) {
alert("ok")
} else {
alert("error")
}
}
}
request.open('Post', href)
})
}
submitForm.addEventListener('click', formcarry)