Calling jQuery Function with Javascript Function

Question

Having some trouble getting this to work, specifically with $.getJSON(). I want to wrap the getJSON function from jQuery in a Javascript function like so:

function reload_data() {
    $.getJSON("data/source", function(data) {
        $.d = data;
    });
}

But when I call reload_data() it doesn't execute the jQuery function inside. Any ideas?

How do you know it isn't executing the function? Did you put a breakpoint on the line inside to check? — Nosredna
– Nosredna, Commented Jul 1, 2009 at 14:15
It's executing just fine. I guess it must be something about the data in the $.d variable not getting refreshed in a way that the rest of the script can use it. — mcmaloney
– mcmaloney, Commented Jul 1, 2009 at 14:37
You're not showing us enough of the picture to give an accurate answer. — Josh Stodola
– Josh Stodola, Commented Jul 1, 2009 at 19:31
Why are you hanging your "d" variable onto the jQuery namespace, by the way? — Nosredna
– Nosredna, Commented Jul 1, 2009 at 20:59

Josh Stodola · Accepted Answer · 2009-07-01 20:28:09Z

3

You're not telling us enough. I will just take a guess!

If you are calling this function, and then immediately checking $.d for the results, that is not going to work because you don't allow time for the asynchronous AJAX request to complete...

reload_data();
alert($.d); // What?!  It's not displaying the updated results?!

You'll have to utilize a callback structure, like jQuery uses, in order to make it work...

reload_data(function() {
  alert($.d);
});

function reload_data(func) {
  $.getJSON("data/source", function(data) {
    $.d = data;
    //Execute the callback, now that this functions job is done
    if(func)
      func();
  });
}

edited Jul 1, 2009 at 20:28

answered Jul 1, 2009 at 19:35

Josh Stodola

82.8k48 gold badges187 silver badges229 bronze badges

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

4 Comments

Nosredna Over a year ago

Yeah, that was my guess too. That's why I asked if he was sure the function wasn't getting called. After all, Ajax is async.

Josh Stodola Over a year ago

That brings up an interesting point. I think he could change his request to be synchronous and that might fix the issue, although I don't think that's the best solution so I will leave my answer as is.

Nosredna Over a year ago

Either way, he's going to have to wait for the ajax to be performed before he can do anything with the variable. I think (but I'm not sure) that the browser's UI will be more responsive if the call is left async.

Josh Stodola Over a year ago

Absolutely. The async requests are smooth, sync ones cause the browser to hang.

BigBlondeViking · Accepted Answer · 2009-07-01 14:18:46Z

2

Put an Alert in side the function to know its getting called.

and a try catch around the jQuery call to see if there is an error

function reload_data() {
    alert('reload_data  start');
    try{
        $.getJSON("data/source", function(data) {
            $.d = data;
        });
     }
     catch (ex){
         alert ('error in jQuery call:' + ex)
     }
}

answered Jul 1, 2009 at 14:18

BigBlondeViking

3,9631 gold badge34 silver badges28 bronze badges

Comments

mcmaloney · Accepted Answer · 2009-07-06 16:08:58Z

0

Thanks for the help everyone, but the solution was actually really simple. It was just a matter of synchronization. The page was reloading before the JSON data got reloaded, so that's why I wasn't seeing an error.

answered Jul 6, 2009 at 16:08

mcmaloney

2,3943 gold badges19 silver badges19 bronze badges

Collectives™ on Stack Overflow

Calling jQuery Function with Javascript Function

3 Answers 3

4 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

4 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related