making an anonymous ajax function into a regular function - scope?

Question

I'm a js/jquery noob and have been struggling to get an anonymous function to work as a regular function. Could someone point out what I'm doing wrong?

Here's what's taken me a few hours:

var tracklist = new Array();

function stuffXML(xml) {
    $(xml).find('track').each(function(){
        var logo = $(this).find('logo').text();
        var location = $(this).find('location').text();
        var id = $(this).find('identifier').text();
        var info = $(this).find('info').text();
        var title = $(this).find('title').text();
        var creator = $(this).find('creator').text();

        tracklist.push(logo,location,id,info,title,creator);

    });

    console.log('mid' + tracklist);  //works here
}

$(document).ready(function(){

    $.ajax({
        type: "GET",
        url: "real.xml",
        dataType: "xml",
        success: stuffXML
    });

console.log(tracklist);  //but not here - empty array

});

I'm trying to parse the list (a bunch of images & text for a slideshow) into an array (successful there) and then have them available but my scope is clearly too confined. I can't see what I'm doing wrong tho...

Any help would be appreciated...

Stephen · Accepted Answer · 2011-10-03 23:37:09Z

2

Your problem is just that you're forgetting what the A in AJAX stands for. Asynchronous. When you run the command for

$.ajax({
    type: "GET",
    url: "real.xml",
    dataType: "xml",
    success: stuffXML
});

It runs it immediately, without hesitation, and follows it up immediately with your console.log. In the background, the browser is busy making a request for the data and then adding it to your tracklist variable. So, what you want to do is put that console.log inside of stuffXML. Granted, you probably want to do other things than console.log.. so, have the 'stuffXML' fire off any other events you need to fire to get the rest of your code doing what it needs to do. Just remember that a web server isn't going to serve a request to your page faster than javascript is going to get to the next line of code to execute.

answered Oct 3, 2011 at 23:37

Stephen

5,4501 gold badge24 silver badges35 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Holland Over a year ago

Thank you! I hadn't noticed that I dropped off the "async: false," from the ajax call. Much, much appreciated (now I can go to sleep...)

alex Over a year ago

@Holland: There is almost never a good reason to do a synchronous XHR. Locking the browser for a request is never a good idea.

Stephen Over a year ago

I've run into a few spots where I've actually had to use synchronous calls, but they are few and far between.. and require a lot of arguing and forethought. Most of the time, they're just misused :)

alex · Accepted Answer · 2011-10-03 23:34:24Z

2

The array is empty there because that code is ran immediately after the DOM is ready, but not necessarily (and extremely unlikely) after the XHR has been completed.

To be able to make use of tracklist, you will need to refer to it inside the stuffXML() function or in another function that's stack trace has a stuffXML() ancestor.

answered Oct 3, 2011 at 23:34

alex

492k205 gold badges890 silver badges992 bronze badges

1 Comment

Holland Over a year ago

It's morning now and I see what you mean...this would be a bad thing. The page it's loading to is heavy and really needs async. Can you explain what you mean?

Dave Newton · Accepted Answer · 2011-10-03 23:34:53Z

1

When you call console.log() in the document-ready function it's unlikely the Ajax request will have completed: the callback happens at the end of the Ajax request; the document ready call will happen immediately after the request has been made.

answered Oct 3, 2011 at 23:34

Dave Newton

161k27 gold badges263 silver badges311 bronze badges

3 Comments

Holland Over a year ago

Yep - that makes sense. I keep forgetting that it's parsing inwards, not outwards. Much appreciated!

Dave Newton Over a year ago

@Holland Not sure what that means, this isn't an issue of parsing, it's an issue of execution order: the callback is parsed in the order it's seen, but executed after the ajax call completed.

Holland Over a year ago

True.. it was 2:30 in the morning; was a bit tired and loopy by then. I see what you mean now.

Collectives™ on Stack Overflow

making an anonymous ajax function into a regular function - scope?

3 Answers 3

3 Comments

1 Comment

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

1 Comment

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related