Question

Here’s the snapshot of the code:

If the function testFields at Line:3 returns false, the control rightly goes to Line:21 and returns false. If testFields returns true, the control goes to Line:4 and then instead of going on to handle the response returned in function at Line:5, the control goes on to Line:21, where the retVal is still false. That is, condition to Line:6 is checked after the function has returned a value to the function:

<form method="POST" onsubmit="return validateInput()" />

Where as, logically, it should first test the condition at Line:7 then decide whether retVal should be true or let it be default false and then value should be returned via Line:21.

What is logically wrong with my code?

Answer 1

There are two ways.

1. You can make synchronous ajax request.

   var retVal ;
   $.ajax({ 
       url: youUrl,
       async: false, // required to pause script until request is done
       success: function( ret ) { 
          retVal = ret; // ret is invisible outside this callback
   
       },
       error : function( err ) {
         // your error logic
       }
   
   });
   //We'll in this line if request is completed and either success or error callback  was called.  
   return retVal;
   

2. But if you don’t want the script been stopped. You can prevent a default action in form, and send the form from callback such as:

   $( "form" ).submit( function( e, extra ) { 
   
     if( !extra )
       $.post( 
         url: "script.php",
         data: "yourdata",
         success: function( ) {  
           $( "form" ).trigger( "submit", [true] );         
         },
        error: function(){}
    );
   
      // extra parameter will be always undefined until we'll not pass it in an array which will be aplied to listener as  next ones arguments - take a look at success callback
     return !!extra  // doubled negate operator ensures that extra will be returned as boolean because if you return undefined  that means you didn't return anything 
   });
   

and in html form tag without onsubmit declaration :

<form method="POST" />