How to prevent execution of event handler?
<p>I wish to authenticate a user each time they click a button.  If the user is logged out, and they attempt to click on a button, they are redirected home.</p>

<p>However the code after <code>validate()</code> is executes before the user is redirected home.  In this example the popup always displays before the user is directed back home.  How do I wait for the execution of <code>validate()</code> to complete before the rest of the event handler attempts to execute?</p>

<pre><code>$("#main-display").on('click', 'button', function (event){
     validate();
     hello = window.open( '', '', "height = 100, width = 100");
     hello.document.write('hello');
});


function validate(){
    $.ajax({
        url: 'validate_user.php',
        dataType: "json",                      
        success: function(response) {            
            if(response.status == 'false') {
                location.href = 'home.php';
            }                
        }       
    });    
}
</code></pre>

<p><strong>validate_user.php</strong></p>

<pre><code>&lt;?php
    session_start();
    if(!isset($_SESSION['userId'])){
        session_destroy();
        $response['status'] = 'false';
    }
    else {
        $response['status'] = 'true';
    }
    echo json_encode($response);          
?&gt;
</code></pre>

<h1>EDIT</h1>

<p>Thanks for the answers, however the popup still displays before the user is directed back even with the code bits of the most upvoted answers.</p>
