0

what am i doing wrong here? i want to get the new beers value with console.log but it is keeping giving me undefined here ist have already tried can someone help me on this?

var beers;
function attached() {
    var inquiryUrl = baseUrl + "/ProviderSingle?$top=8";
    $.getJSON(inquiryUrl, function (viewModelFromServer) {
        beers = JSON.stringify(viewModelFromServer.value);
    });
}

console.log(beers);
Gildas.Tambo
  • 22,173
  • 7
  • 50
  • 78
  • The call is asynchronous, so you're loging before you set beers. log from the callback. – Denys Séguret Feb 27 '14 at 10:45
  • @kougiland by giving `async:false` your code may work.... – James Feb 27 '14 at 10:48
  • 1
    you making async call inside your function.make use of [this](http://stackoverflow.com/questions/14220321/how-to-return-the-response-from-an-ajax-call)link – kamesh Feb 27 '14 at 10:52
  • @james async:false is invalid $.getJSON(inquiryUrl, async:false, function (viewModelFromServer) { – Gildas.Tambo Feb 27 '14 at 10:54
  • 1
    @kougiland I forgot specify that, you need to use `$.ajax` to use `async`. `$.getJSON` is the shorthand version of `ajax` it doesn't provide that property. – James Feb 27 '14 at 10:58

2 Answers2

2

Because $.getJSON is an asynchronous call. It wont wait for the complete event to happen. Try like

function attached() {
var inquiryUrl = baseUrl + "/ProviderSingle?$top=8";
$.getJSON(inquiryUrl, function (viewModelFromServer) {
    beers = JSON.stringify(viewModelFromServer.value);
    console.log(beers);
});
}

Asynchronous means that the code doesn't perform in a queue (sync does):

alert( 1 );
alert( 2 );
alert( 3 );

These will always do 1,2,3, they are synchronous. The following code is asynchronous:

alert( 1 );
$.getJSON(inquiryUrl, function (data) { alert( 2 ); });
alert( 3 );

Lets say the ajax-call takes 1 second. The alerts will go 1,3 and 1second after this codes starts the async ajax-call is ready and will alert the 2

Martijn
  • 15,791
  • 4
  • 36
  • 68
Anoop Joshi P
  • 25,373
  • 8
  • 32
  • 53
  • 1
    i want to use it outside of the attached i didn't downvote you answer by the way – Gildas.Tambo Feb 27 '14 at 10:47
  • @kougiland by giving async:false your code may work... – James Feb 27 '14 at 10:48
  • @kougiland - are you getting value as Anoop Joshi suggested? – 124 Feb 27 '14 at 10:49
  • 1
    @NikhilButani: the OP wants to place the `console.log` outside of the `attached` function. – Qantas 94 Heavy Feb 27 '14 at 10:50
  • @Nikhil Butani yes i am getting the value like that but that is not what i want – Gildas.Tambo Feb 27 '14 at 10:51
  • Yes @Qantas94Heavy got that, but need to confirm that function returning value or not? – 124 Feb 27 '14 at 10:51
  • @NikhilButani: sorry, not quite sure what you mean. An asynchronous function usually doesn't return a value (apart from promises). If you're referring to `attached`, it doesn't return a value. – Qantas 94 Heavy Feb 27 '14 at 10:53
  • @kougiland Why would you want to use it outside of the ajax function? The only logical place to have it is in the success callback of the ajax request. You could always refactor it to call a different function onsuccess if you are concerned with the legibility of the code – heymega Feb 27 '14 at 11:01
  • @heymega because codes are more readable then. Also, promise is quite recommended for cleaner code – Bikas Feb 27 '14 at 11:06
1

Use promise to correctly update the values.

var beers;
var promise = null;
function attached() {
    var inquiryUrl = baseUrl + "/ProviderSingle?$top=8";
    promise = $.getJSON(inquiryUrl);
}

promise.done(function(data) {
    beers = JSON.stringify(data.value);
    console.log(beers);
});
Bikas
  • 2,709
  • 14
  • 32