CODEWITHSUNDEEP
jqueryjquery-validate
JohnG
JohnG

Reputation: 497

JQuery Validation plugin success function on submit?

I've been trying to make a form which, once validated, sends an email and returns a "sent" message on the same screen. In other words I need to somehow combine the action of:

$('#mailForm').on('submit', function(){
$("#formContainer").html("Thanks! Your message has been sent.")
$.post($(this).attr('action'));
  return false;
});

with:

$('form').validate();

Reading, I have an idea it should be something like this:

$("#mailForm").validate({
   submitHandler: function(form){
     $("#mailForm").ajaxSubmit();  
     $("#formContainer").html("Thanks! Your message has been sent."); 
     return false; 
   };
 });

But this just breaks the page, so is clearly nonsense. Can anyone help?

Upvotes: 1

Views: 1369

Answers (1)

RAUSHAN KUMAR
RAUSHAN KUMAR

Reputation: 6004

you should write your code as

$('#mailForm').validate({

    ... your validation rules come here,

    submitHandler: function(mailForm) {
        $.ajax({
            url: form.action,
            type: form.method,
            data: $(mailForm).serialize(),
            success: function(response) {
                $("#formContainer").html("Thanks! Your message has been sent.");
            }            
        });
    }

});

Upvotes: 1

Related Questions