Execute a function according to ajax response

Question

I have 2 functions which are being called onBlur to validate if username or email registered before completing the registration process.

these are the 2 functions

function checkname() {
    jQuery.ajax({
        url: "includes/check_signup.php",
        data:'username='+$("#name").val(),
        type: "POST",
        success:function(data){
            $("#error").html(data);
        },
        error:function (){}
    });
}

function checkemail()
{
    jQuery.ajax({
        url: "includes/check_signup.php",
        data:'email='+$("#email").val(),
        type: "POST",
        success:function(data){
            $("#error").html(data);
        },
        error:function (){}
    });
}

I have a 3rd function that gets executed on button submit to send the user data to the database. Now, how can I stop that function from being executed if any of the above functions returned success that "username/email is already registered?"

This is the 3rd function

 $('#btn-signup').click(function(){
    $.post( 
        $('#register-form').attr('action'),
        $('#register-form :input').serializeArray(),
        function(result){
            $('#result').html(result);
        }
    );
});

Answer 1

Use a semaphore to control the traffic you desire, imagine you have a DOM object with class result_email and result_name, and originally both contain .text() == "blocked"

$('#btn-signup').click(function() {
    if(!$(".result_email").text() && !$(".result_name").text()) {
        $.post(
            // etc
        );
    } else {
        $("#error").focus();
    }
});

And if either call succeeds, meaning username or e-mail is existing already, we turn the semaphore on to block registration button click event, but if the check method called again, and it failed, thus name or email is OK for registration, we remove the block from semaphore;

function checkemail() {
    jQuery.ajax({
        url: "includes/check_signup.php",
        data:'email='+$("#email").val(),
        type: "POST",
        success:function(data){
            $(".result_email").text("blocked")
            $("#error").html(data);
        },
        error:function (){
            $(".result_email").text("")
        }
    });
}

function checkname() {
    jQuery.ajax({
        url: "includes/check_signup.php",
        data:'username='+$("#name").val(),
        type: "POST",
        success:function(data){
            $(".result_name").text("blocked")
            $("#error").html(data);
        },
        error:function (){
            $(".result_name").text("")
        }
    });
}

You can use a global variable in JS also, but better to use a DOM element IMO.