CODEWITHSUNDEEP
javascriptphpjqueryajax
Patzi0207
Patzi0207

Reputation: 13

jQuery AJAX url to PHP file doesn´t work

On my website I have a normal contact form in which you can put in your name, email and a message.

For this form I have script.js, which proofs if the user input is correct and complete. If everything is alright, an AJAX call should point to form-mail.php, in which I send the request from the user to the owner.

script.js and form-mail.php work, but I don´t know the mistake in the AJAX call?

if (sum == 0) {
    document.getElementById("name").style.borderColor = "green";
    document.getElementById("email").style.borderColor = "green";
    document.getElementById("nachricht").style.borderColor = "green";

    $.ajax({
        type: "POST",
        url: "mailform/form-mail.php",
        data: $("#myForm").serialize(),
        beforeSend: function() {$("#myForm").css({"opacity": "0.2"})}
    }).done(function(msg) {
        $("#emailform").fadeOut(1000);
        setTimeout(function () {
            $("#myForm").append('<p id=\"adder-content\" style=\"display:block;width:100%;margin:0 auto;padding-top: 3em;text-align:center;color:green\"><span>' + msg + '</span></p>').css({"opacity": "1"});}, 1000);
    });

    e.preventDefault();
    window.location.href = "http://www.just.a.test";
}

I had this code in two other projects and it worked, but since yesterday there´s a problem with it.

Upvotes: 1

Views: 99

Answers (2)

perumal N
perumal N

Reputation: 651

Try this

$.ajax({
    url: 'mailform/form-mail.php',
    type: 'POST',
    data: {data:data},
    before:function(){
       $("#myForm").css({"opacity": "0.2"});
    }
    success:function(response){ 
        console.log(response);
    }
});

Upvotes: 0

prabushitha
prabushitha

Reputation: 1483

I think the problem is with 

window.location.href = "http://www.just.a.test";

before the completion of the ajax call it redirects. Remove it or place it in the done section of the ajax call.

This should work

if (sum == 0) {
        document.getElementById("name").style.borderColor = "green";
        document.getElementById("email").style.borderColor = "green";
        document.getElementById("nachricht").style.borderColor = "green";
      $.ajax({
        type: "POST",
        url: "mailform/form-mail.php",
        data: $("#myForm").serialize(),
        beforeSend: function() {$("#myForm").css({"opacity": "0.2"})}
      })
        .done(function(msg) {
          $("#emailform").fadeOut(1000);
          setTimeout(function () {
            $("#myForm").append('<p id=\"adder-content\" style=\"display:block;width:100%;margin:0 auto;padding-top: 3em;text-align:center;color:green\"><span>' + msg + '</span></p>').css({"opacity": "1"});
            window.location.href = "http://www.just.a.test";
          }, 1000);

        });
        e.preventDefault();
        // window.location.href = "http://www.just.a.test";
};

Upvotes: 1

Related Questions