I can only modify the code in the ajax call. The ajax call occurs when I click the submit in form named $('#form1').

$('#form1').submit(function () {
    $.ajax({
       url: 'some.php',
       type: 'POST',
       data: somedata,
       success: function (msg) {
          if (!msg) {
             // I wanna to stop '#form1' submit here,how to do that? I can only modify the code in the ajax call.
          }
       }
    });
 });

I can only modify the code in the ajax call. The ajax call occurs when I click the submit in form named $('#form1').

$('#form1').submit(function () {
    $.ajax({
       url: 'some.php',
       type: 'POST',
       data: somedata,
       success: function (msg) {
          if (!msg) {
             // I wanna to stop '#form1' submit here,how to do that? I can only modify the code in the ajax call.
          }
       }
    });
 });

• javascript
• jquery
• ajax

7 Answers 7

You'll need to stop it BEFORE the success handler. Because the function finishes executing after your AJAX call the form will submit while your ajax call is occurring (and by the time your ajax call finishes it is too late).

But yes, put return false at the end of your function.

function SubmitHandler(){
  // Your AJAX call here
  // blah blah blah

  return false;  // Stop form submit
}

If it's really important that it is in the success handler, then you could execute the call synchronously.

You can also use preventDefault()

http://api.jquery.com/event.preventDefault/

return false or event.preventDefault should help you:

$('#form1').submit(function(){
    $.ajax({
        url:'some.php',
        type:'POST',
        data:somedata,
        success:function(msg){
        if(!msg){
            //i wanna to stop form1 submit here,how to do that?  you can only modify the code in the ajax call
        }
    }
    });
    return false;
});

or:

$('#form1').submit(function(e){
    e.preventDefault();
    $.ajax({
        url:'some.php',
        type:'POST',
        data:somedata,
        success:function(msg){
        if(!msg){
            //i wanna to stop form1 submit here,how to do that?  you can only modify the code in the ajax call
        }
    }
    });
});

Put a

return false;

This should stop the function to continue

You need to prevent form submitting

onclick="ajaxcall(); return false;"

And do it in your code:

 $.ajax({
  url:'some.php',
  type:'POST',
  data:somedata,
  success:function(msg){if(msg) $('#form1').submit();}
 })

You can change button type from "submit" to "button" then submit form using jquery form.submit(); function according to your conditions. Consider the following example code below:

<script>
 $(document).ready(function() {
$("#button-id").click(function() //on click at button
{

var sel=$("#input").val();

        $.post("ajax-war.php",{jid:sel,rand:Math.random() } ,function(data)
        {

          if(data=='valid') //if correct login detail
          {

$('#war_form').submit(); //Submit form
          }

          else
          {
              alert('not valid'); //will not submit form

          }
});       
});
}); 

</script>

Assuming the form's ID is #form1, you could bind a submit handler and return false from it:

$.ajax({
  url:'some.php',
  type:'POST',
  data:somedata,
  success:function(msg){
    if(!msg){
     $('#form1').submit(function(){
       return false; // prevents form submit
     });
    }
  }
 })