-1

I am trying to encapsulate an AJAX call inside of an object, and by following threads here on SO I have been able to create an object (Product) with two properties, getval (a function for the AJAX call) and myobj (an object containing the results of the AJAX call). When I console log the Product object it shows both properties with the expected attributes. However, when I console log just the Product.myobj property it comes back undefined. So, my first question is why am I getting an undefined? and the second is this a hacky method and is there a better approach?. Thanks from a newbie, here is my code:

var url = "http://mazihealth.com";

function callback(data) {}
var Product = {
    getval: function (url, callback) {
        $.getJSON('http://whateverorigin.org/get?url=' + encodeURIComponent(url) + '&callback=?', function (data) {
            callback($(data.contents));
        });
    }
};
Product.getval(url, function (data) {
    Product.myobj = data.filter('div').children();
    console.log(Product.myobj); //Object[5]
});
console.log(Product) //Object with 2 properties
console.log(Product.myobj); //undefined

UPDATED CODE: I fixed up the callback and now create the Product.myobj in the callback function. Is there a way to encapsulate the callback function inside the Product object to create the Product.myobj property?

var url = "http://mazihealth.com";  
var Product = {getval:function(url, callback) {                      $.getJSON('http://whateverorigin.org/get?url=' +    encodeURIComponent(url) + '&callback=?', callback);
    }
};

function callback(data) {
  Product.myobj = $(data.contents).filter('div').children();
};

Product.getval(url, callback);
console.log(Product)  //Object with 2 properties

Answer to my question found here: Using $.getJSON() with callback within a Javascript object

I refactored my code in two minutes and had exactly the result I needed.

Community
  • 1
  • 1
user2232681
  • 839
  • 4
  • 16
  • 33
  • By what "following threads"? Please link them. – Bergi Apr 30 '14 at 21:11
  • Why did you declare that empty `function callback`? – Bergi Apr 30 '14 at 21:12
  • What did you consider to be the "maybe hacky method", to `console.log(Product)` and [wait before you inspect it](https://stackoverflow.com/questions/23392111/console-log-async-or-sync/23392650#23392650), or to use the callback and `console.log(Product.myobj)` in there? – Bergi Apr 30 '14 at 21:15
  • http://stackoverflow.com/questions/16020929/return-value-from-getjson-function – user2232681 Apr 30 '14 at 21:18
  • You should have a look at the canonical question http://stackoverflow.com/questions/14220321/how-to-return-the-response-from-an-ajax-call – Bergi Apr 30 '14 at 21:23
  • Yes, I looked at that one as well. Both were of help with the use of the callback function. I left my callback empty because I wasn't sure what to do within the function other than to retrieve the result. – user2232681 Apr 30 '14 at 21:28
  • The callback you left empty is irrelevant, it's not the one you call. You're calling the `callback` that is passed as a paramter to `getval`, which is the `function(data) { console.log(data.filter('div').children()); }` – Bergi Apr 30 '14 at 21:30

1 Answers1

0

In your code Product.myobj will always be undefined unless the jQuery.getJSON success has been called

and since you immediately call console.log after running the Product.getval function then it will execute before the callback due to network delay.

Aboalnaga
  • 602
  • 6
  • 16