0

i'm using an ajax function to return a value so i can save it in a variable and use it anywhere but it's not working i get a message : undefined

function getData(){
    var ajax = false;
    ajax = new XMLHttpRequest()
    ajax.open("GET","ajax.php");
    ajax.onreadystatechange = function(){
        if(ajax.readyState == 4 && ajax.status == 200){
            var test = ajax.responseText;
            return test ;
        }
    }
    ajax.send(null);
}

$(document).ready(function(e) {
    var n = getData();
    alert(n);
});
6
  • AJAX stands for Asynchronous JavaScript + XML. So you would not get the return value immediately as it is async. Commented Oct 29, 2013 at 19:31
  • so how to solve this problem ? Commented Oct 29, 2013 at 19:31
  • first: if you see your return is in onreadystatechange function not getData(). second: to use asynchronuos request you need another aproach, do you logic inside that if Commented Oct 29, 2013 at 19:31
  • Continue your code logic inside the success callback ajax.readyState == 4. Commented Oct 29, 2013 at 19:32
  • any working example to learn from it ? Commented Oct 29, 2013 at 19:39

2 Answers 2

1

Try:

function getData() {
    return $.ajax({
        type: "GET",
        url: "ajax.php",
        async: false,
    }).responseText;
}

$(document).ready(function(e) {
    var n = getData();
    alert(n);
});
Sign up to request clarification or add additional context in comments.

Comments

0

Firstly in your example the function getData() does not actually return anything. You are making an AJAX request, and when the AJAX request is successful you say return data, but the getData() function itself does not return anything. You have a function that returns something (a child function) inside of another function (the parent function). The parent function, which is the function that you are actually calling, doesn't have any return value. This is why you are always seeing "undefined" when you try to alert the result of getData().

Like the commenters above said, AJAX stands for Asynchronous Javascript and XML, meaning that your request to get data runs independently of everything else in your script. This is one of the reasons why we have events, so you can wait until things have happened before trying to do something with its result.

In your example, you are already listening to the onreadystatechange event with this:

ajax.onreadystatechange = function(){
    if(ajax.readyState == 4 && ajax.status == 200){
        var test = ajax.responseText;
        return test ;
    }
}

What you need to do is wait until the request is complete before trying to manipulate the data that was returned from the AJAX request. If you store the variable test outside of the getData function, then it will be available to other functions throughout your script. When the AJAX request was successful, then you can store the data returned in test and call another function that does stuff with test.

Here's some code to show you what I mean:

// Keep "test" globally outside of the scope of getData
// This makes "test" available throughout the rest of the script
var test;


function getData(){

    var ajax = false;
    ajax = new XMLHttpRequest()
    ajax.open("GET","ajax.php");
    ajax.onreadystatechange = function(){
        if(ajax.readyState == 4 && ajax.status == 200){

            // This is where we know that the AJAX request has completed
            // so we know we have the data. Store the data in the "test"
            // variable, and call another function here that will do something
            // with "test" - this way "test" won't be undefined!
            test = ajax.responseText;
            doNextStep();
        }
    }

    ajax.send(null);
}

// This new function I've introduced won't get called until
// the Ajax request was successful.
function doNextStep() {
    alert( test );
}

$(document).ready(function(e) {
    getData();
});

Hope this helps!

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.