Accessing a global variable inside of a function which is a parameter for another function

Question

I'm trying to access a global variable inside of the success function of a $.ajax() call. Basically I have something like this:

function someFunc(email) {
var ret;
$.ajax({
    url: '/checkuseremail.php?email='+email,
    cache: false,
    success: function(data) {
        if ( data != '1' ) {
            alert(email+'\n'+data);
            ret = false;
        } else {
            alert(email+'\n'+data);
            ret = true;
        }
    }
});

alert(ret); // outputs "undefined"
return ret;
}

I'm aware that the alert() at the bottom is being called before the ajax response has been given, but I'm not sure what else to do. I would just put the return statement inside of the success function, but that would only return that function, not the parent one.

Any ideas how to do this?

*I'm not sure what else to do.*: Restructure your code to be inside of the `success` callback function. — Andrew Whitaker, Mar 02 '13 at 22:36
I'm not sure how I would do that, because this function is being called as part of a login form validation whenever the form is submitted. I could put the entire form validation inside the success function, but that seems like bad practice. Is there not an elegant way to do it? — SISYN, Mar 02 '13 at 22:39

score 0 · Answer 1 · answered Mar 02 '13 at 22:42

0

Either take a look at $.Deferred() or pass in a callback function into someFunc as second parameter. Then call that callback function on success.

answered Mar 02 '13 at 22:42

xat

346
3
5

score 0 · Answer 2 · answered Mar 02 '13 at 23:35

Given your last comment "... function is called as part of a form validation when form is submitted" I think that your requirement translates into a synchronous handling of the request. In those cases, you can force synchronous behaviour on the ajax call. Try adding:

async: false,

to your Ajax options.

score 0 · Answer 3 · answered Mar 03 '13 at 00:17

Don't think of success like a function that returns a value. It's a setting of $.ajax() that determines what action to take on the success (event), like a controller.

There are a couple of issues.

You said it in your original post. You are calling the alert before control is back in the hands of the client.
The error message was telling you this. Undefined When you are returning a value from a function, you have to assign it to something. ret is global to our function but it's never assigned a value.
You also need to parse the data object returned for your value. I'm assuming the data != '1' is just some sample code? You are getting a JSON object back most likely, possibly XML but either way it's not properly parsed.

You should use $.get() instead of $.ajax(). $.get calls $.ajax and is the preferred method.

function someFunc(email) {
// assign the value returned to ret
var ret = $.get({ // 2 assign value, 4 use $.get
    url: '/checkuseremail.php?email='+email,
    cache: false,
    success: function(data) {
        if ( data ) {
            anotherFunc(data); // 3 parse data in function
            return false;//1 alert removed
        } else {
            return true;
        }
    }
});

alert(ret);
return ret;
};

`

Accessing a global variable inside of a function which is a parameter for another function

3 Answers3