Skip to content Skip to sidebar Skip to footer

Form Not Submitting With Ajax

=====UPDATE AGAIN==== (if anyone cares!) the solution I posted before stopped working for whatever reason. I included a beforeSend in my ajax request and pasted the portion of my j

Solution 1:

Change done to success:

success:  function(data){

success only fires after your request got response and the response code is OK(http 200).

Solution 2:

Update the code below:

$('form').on('submit', function(e) {
e.preventDefault();     
if(!validateForm(this)){
returntrue;
}
var formdata = $(this).serialize();

$.ajax({
        type: "post",
        url: "http://www.example.com/client_config_send2.php",
        data: formdata,
        success:  function(data){
            alert("Thank you, we will get back to you shortly");
}
        });

})  


</script>

Solution 3:

Could you try removing/commenting event.preventDefault();

If this method is called, the default action of the event will not be triggered. (http://api.jquery.com/event.preventdefault/)

Solution 4:

Try coding in the following format. The logic uses an if/else statement to make the ajax call.

$('form').on('submit', function(e) {
    //If form could not be validatedif(!validateForm(this)){
       //prevent the form form submittingalert("Your form is not valid for submission!");
        e.preventDefault();  
    }
    //else else{
        //form input is valid//make the ajax call
        $.ajax({
            type: "post",
            url: "client_config_send2.php",
            data: $(this).serialize(),
            done:  function(data){
                alert("Thank you, we will get back to you shortly");
            }
           });
       }
    });
 });

Solution 5:

Here is the final code that does exactly what I want: - the validateForm() function works as it should. If the form is not complete, it returns false, an alert pops up and the form does not submit - if validateForm() returns true, the form gets submitted, the confirmation alert pops up and the page does NOT refresh. Users can then build a new configuration and submit a new request without re-entering all the contact info.

The 2 .preventDefault did the trick!

$('form').on('submit', function(e) {
e.preventDefault(); //prevents page refresh when form is submitted//If form could not be validatedvar x = validateForm();
if(x == false){
   //prevent the form form submitting
    e.preventDefault();  
}
//else else {
    //form input is valid//make the ajax call
    $.ajax({
        type: "post",
        url: "client_config_send2.php",
        data: $(this).serialize(),
        success:  function(data){
            alert('Thank you! we will get back to you within 24 hours. Please check your junk / spam folder if you do not receive a response within that time.');
        }
       });
   }
});

Thanks everyone for your help!

Post a Comment for "Form Not Submitting With Ajax"