Question

I am forced to use data from within the getJSON callback function outside of that function. Have a look:

$('#stars').raty({
        score: function() {
            var $value = 0;
            var $id = <?=$id?>;
            $.getJSON("getuserrating.php?id=" + $id, function(data) {
                $.each(data, function(key, val) {
                    $value = val;
                });
            });
            return $value;
        },
    });

This is what I tried but it failed, the $value is still set to 0, although inside the callback it’s definitely set to an actual value. I know why it fails, because the AJAX request is send asynchronously. The problem is, the correct way, doing everything inside the callback, is not possible. As you can see I need to retrieve the JSON object within the raty (a plugin) setup. I would just use $.ajax() and set that to synchronous but the documentation marks this as deprecated for 1.8. I’d rather not introduce a solution that I know will be deprecated in the future.

Is there any way at all to do this? Maybe I just don’t see the forest for the trees and there’s an easy solution right before me. Thanks in advance 🙂

Answer 1

Approach is backwards if you need to use ajax to get the score.

Make the ajax call first, then pass the value to score within the ajax success

$.getJSON("getuserrating.php?id=" + $id, function(data) {
          /* pseudo code here since I don't know the plugin and it's data requirments*/
         var score= data.score;
         $('#stars').raty({
             score: score
         });      
});

EDIT: you can still pass the data into a score function this way also