JavaScript function always run bottom code

Question

I have this partially working code. What it suppose to do is to check for existing email address in database. If no email exist then return true;

 $(document).ready(function() {

    var email_check = 0;    

        var checking_html = '<img src="http://i.imgur.com/Y8wXAZp.gif" /> Checking...';
        var characters_error = 'Minimum amount of chars is 6';

        //when button is clicked
        $('.register').click(function(){    

            //run the character number check
            if($('#email').val().length < 1){

                $('#email_result').html(characters_error);
                return false;
            }                   
            else{           
                //else show the cheking_text and run the function to check
                $('#email_result').html(checking_html);

                alert(check_email_availability());
            }
        });


  });

//function to check email availability  
function check_email_availability(){

        //get the email
        var email = $('#email').val();

        //use ajax to run the check
        $.post("check_email.php", { email: email },
            function(result){
                email_check = 0;
                //if the result is 1
                if(result == 1){
                    //show that the email is available
                    email_check = 1;

                }else{
                 email_check = 0;
                }

        });

        if (email_check == 1){  
             return true;   
        }else{
             return false;      
        }   

}

Now, the problem is if current state is false, when I enter an email that is not available in the db and click button, I still get false alert, and when the next time I click button I get true alert. For some reason the function execute bottom code first (checking email_check value) and after that it execute the function. Why is that? What is wrong with my code? How can I make it execute function and then check the email_check value whether 1 or not?

The post request runs asynchronously which means it will evaluate once it gets it's response. Your if block will run before the post has returned. — meadowstream
– meadowstream, Commented Feb 15, 2015 at 1:18

Ross Bush · Accepted Answer · 2015-02-15 01:39:08Z

2

I would change this to put an ajax success callback on your check function something along the lines of.

success: function (data, status, xhr ) {
   myFunctionShowEmailSuccess();
},
error: function (xhr, status, error) {
    myFunctionShowEmailFailure();
}

edited Feb 15, 2015 at 1:39

answered Feb 15, 2015 at 1:34

Ross Bush

15.2k2 gold badges39 silver badges65 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

sg552 Over a year ago

Thanks for giving me idea. I use almost similar approach. My problem has been solved. Thanks again.

minion · Accepted Answer · 2015-02-15 01:51:35Z

0

Try doing this.

//function to check email availability  
function check_email_availability(){

        //get the email
        var email = $('#email').val();

        //use ajax to run the check
        $.post("check_email.php", { email: email },
            function(result){
                email_check = 0;
                //if the result is 1
                if(result == 1){
                    //show that the email is available
                    return true;
                }else{
                 return false;
                }

        });

}

answered Feb 15, 2015 at 1:51

minion

4,3532 gold badges22 silver badges35 bronze badges

1 Comment

sg552 Over a year ago

Unfortunately, I don't get any alert.

Collectives™ on Stack Overflow

JavaScript function always run bottom code

2 Answers 2

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related