0

I have the following code 

function test(){
var api_url = "/Test/";

api.CFClient.load(api_url,function(success){

  success.images; // Object with images 
},function(error){

});

// More code to use the images returned.

I am basically unable to get the images from the success function. If i execute my code within the success function i am able to access the returned object. How do i store the returned object in a variable so i can use that object in my parent function and not the success function ?

Gaurav Jagtap
  • 151
  • 1
  • 1
  • 12
  • This code looks _asynchronous_. If you're trying to access a variable synchronously, change to a callback pattern – Paul S. Jul 24 '15 at 16:51
  • `More code to use` should wait while `images returned` it can be some event receivers, for example, or just wait eventually with `setInterval` – vp_arth Jul 24 '15 at 16:53

3 Answers3

0

I presume api.CFClient.load is asynchronous, and in that case you can't access success.images immediately in the test() function after invoking the load function. It will be available at some unknown time in the future, when the ajax request has completed. You'll have to invoke a different function from within your success callback and do whatever you need to do with success.images there, or else do what you need to do directly in the success callback function.

Hannes Johansson
  • 1,794
  • 2
  • 15
  • 28
0

You need to account for the success function being asynchronous. You won't be able to use the returned images until the api call is complete. When it is, you can call another function and pass the images.

function test(){
    var api_url = "/Test/";

    api.CFClient.load(api_url,function(success){

       useImages(success.images); 

    }, function(error){
});

function useImages(images) {
    // do something with images here...
}
mac
  • 858
  • 1
  • 6
  • 11
  • Tried this pastebin.com/B79AAcTR Keep getting undefined – Gaurav Jagtap Jul 24 '15 at 17:07
  • Add the `console.log(res)` to within the `useImg` function. Currently, that console.log is executing immediately after the api call is invoked. – mac Jul 24 '15 at 17:11
  • isn't there any way other than the useImg function ? i'm using react.js and i need the data to render the component. I know console.log(res) will return within the useImg function. – Gaurav Jagtap Jul 24 '15 at 17:20
  • There is unfortunately no way around the fact the the API call will take time, and therefore you will have to wait for the data before rendering your component. A common answer for this is to add elements to the DOM when your data is returned, so that your entire page isn't waiting on the request. There are many ways to do this both server side and client side. – mac Jul 24 '15 at 17:30
0

SO is full of errors like this(asynchronous workflow), just google for...

function test(){
  var api_url = "/Test/";
  function useImages(err, images) {
    if (err) return console.error(err);
    console.log(images);
  }
  api.CFClient.load(api_url,function(success){

    useImages(null, success.images); 
  },function(error){
    useImages(error);
  });
}
vp_arth
  • 14,461
  • 4
  • 37
  • 66
  • Tried this http://pastebin.com/B79AAcTR Keep getting undefined. – Gaurav Jagtap Jul 24 '15 at 17:06
  • omg, use it in callback(`useImages`), it is `undefined` because query is not finished yet, when you try to use it. It's normal behavior of asynch calls. – vp_arth Jul 24 '15 at 17:11
  • You can't get it where you want. – vp_arth Jul 24 '15 at 17:12
  • isn't there any way other than the useImg function ? i'm using react.js and i need the data to render the component. I know console.log(res) will return within the useImg function. – Gaurav Jagtap Jul 24 '15 at 17:20
  • I can't to believe, that thing named `reactjs` wait synchronous render call. Try to call it instead of console.log. Sorry, I never used `react.js` – vp_arth Jul 24 '15 at 17:25