How to check ajax/php response async?

Question

this code doesn't work, because it always return undefined. In my opinion the "success" from the ajax should return, if the result is there.

How to make sure, that the boolean will be returned?

<script>
        $('#sbtn').on("click", function(e) {
                e.preventDefault();
                
                // if user exists, set validated to true
                var validated = checkUser('requestedUser');
                
                
                
                // if the user is validated, submit form
                if(validated) {
                    //alert("Thank You");
                    $('#setup').submit();
                }
        }
        
        function checkUser(user) {
                
                data = {
                    lernsax_email: user
                }
                
                $.ajax({
                  type: "POST",
                  url: "checkuser.php",
                  data: data,
                  success: function(msg){
                        if(msg === "passed") {
                            // php returns "passed", if the user can be found
                            console.log(msg);
                            return true;
                            
                        }   else {
                            console.log(msg);
                            return false;
                        }               
                        
                    },
                  
                });
        }
    
    
</script>

The function checkUser() doesn't return anything. It sets up the Ajax call and then does nothing. The return you have is in the callback, which is a different function and will be called when the ajax gets the response, which happens after the checkUser() function has finished. You need to call the ajax and then put the code you want in the callback. — M. Eriksson, Apr 12 '22 at 06:24

Xupitan · Accepted Answer · 2022-04-12T07:33:17.380

you can use Promise

<script>
    $('#sbtn').on("click", function(e) {
            e.preventDefault();
            
            // if user exists, set validated to true
            let result = checkUser('requestedUser');
            result.then(validated => {
                if(validated) {
                    //alert("Thank You");
                    $('#setup').submit();
                }
            });
    }
    
    function checkUser(user) {
            data = {
                lernsax_email: user
            }
            return new Promise(resolve => {
                $.ajax({
                  type: "POST",
                  url: "checkuser.php",
                  data: data,
                  success: function(msg){
                        if(msg === "passed") {
                            // php returns "passed", if the user can be found
                            console.log(msg);
                            resolve(true);
                            
                        }   else {
                            console.log(msg);
                            resolve(false);
                        }               
                        
                    },
                  
                });
            });
    }
</script>

or move

if(validated) {
   //alert("Thank You");
   $('#setup').submit();
}

to success funtion of ajax

<script>
    $('#sbtn').on("click", function(e) {
            e.preventDefault();
            
            // if user exists, set validated to true
            checkUser('requestedUser');
    }
    
    function checkUser(user) {
            
            data = {
                lernsax_email: user
            }
            
            $.ajax({
              type: "POST",
              url: "checkuser.php",
              data: data,
              success: function(msg){
                    if(msg === "passed") {
                        // php returns "passed", if the user can be found
                        console.log(msg);
                        $('#setup').submit();
                        return true;
                        
                    }   else {
                        console.log(msg);
                        return false;
                    }               
                    
                },
              
            });
    }
</script>

Thank you, this would solve the problem for the first time, but I've got some more things to validate in my script (actually). So I should make sure that the return of checkUser() is true or false. e.G if(val1 === "so" && val2 === "on" && validated) { $('#setup').submit(); } — WhiteAudii, Apr 12 '22 at 07:26
you shound use promise with resolve and reject for case : success and error of ajax — Xupitan, Apr 12 '22 at 07:36

How to check ajax/php response async?

1 Answers1