How Can I Return An Ajax-retrieved Value To The Parent Function Of The Current Function In Javascript?

I have the following JavaScript (and jQuery) code: function checkEmail(email) { if (email.length) { $.getJSON('ajax/validate', {email: email}, function(data){

Solution 1:

Generally, the best way to handle this type of issue is to use some form of callback function. Actually, it is really the only practicable solution -- the only other option is coding your own extensions to the browser, and that is a little much (unless you really like banging your head against a wall). There are actually quite a few parallel questions on these boards: you might try searching for some, many are very good.

Modifying your code:

functioncheckEmail(email) {
    /*
        original parts of the function here!
    */if (email.length) {
        $.getJSON('ajax/validate', {email: email}, function(data){
            if (data == false) {
                // stuff
            }
            checkEmailResponse( data );
        })
    }
}

functioncheckEmailResponse( data )
{
    // do something with the data.
}

Solution 2:

You should as well use a callback because the call is asynchronous and therefore design you whole JavaScript source around that idea (as the others pointed out).

If you really really need to get it as a return value you need to turn the asynchronous call off but this is not recommended at all, because it blocks the page till the response is there.

functioncheckEmail(email, callback) {
    if (email.length) 
    return $.ajax({
      data:  {email: email},
      url: 'ajax/validate',
      async: false
     }).responseText; // only the raw response text of the XMLHttpRequest
    }
}

Solution 3:

You could have the parent function block until there is something there. And to reduce the CPU intensiveness, you could use a timeout of somekind.

functioncheckEmail(email) {
if (email.length) {
    var ret = null;
    $.getJSON('ajax/validate', {email: email}, function(data){
        if (data == false) {
            // stuff
        }
        ret = data;
    }) 
   while(ret == null){

   }
   return ret;
}

}

Hope this helps.

Solution 4:

You'll just have to change the way you approach the problem. You know that what you have above won't work, so you can't think in terms of "call a function and operate on its return value".

You'll need to switch to something like toby's suggestion of CPS, or depending on what's triggering this function, handling it with custom events.