CODEWITHSUNDEEP
javascript
Vinie
Vinie

Reputation: 2993

Get result from success handler

I am listing game in my application. Some are paid and some are free so during listing I am calling a method to get price from play store and response getting in Success callback. My problem is my success handler setting price after listing all games so all games are listed as free. My code is

Listing game

function render(res)
{
    for (var i = 0; i < res.length; i++) {
        var data=res[i];
        if(data.product_id!='Free' && data.product_id!='')
        {
            getDetails(data.product_id);
        }
        else
        {
            price='Free';
        }
        console.log(price);
        var gameOnScreen = "<li class='game-box showlist'  data-tag='" + app_tag + "' >" +
        "<div class='game-box-link' data-id='" + game.ID + "' data-orientation='" + orientation + "' data-ajax='false' data-url='" + link + "' data-transition='none'>" +
        "<img src='" + thumb + "' class='game-thumb'>" +price+
        "</div></li>";
        }
    }
}

Get Detail

function getDetails(productlist)
{
    inappbilling.getProductDetails(successHandler2, errorHandler, productlist);
}

successHandler2

function successHandler2 (result)
{
    price= result[0].price;
    console.log(price);
}

enter image description here

In image you can see price is coming after listing all games.

Upvotes: 1

Views: 415

Answers (3)

Hp93
Hp93

Reputation: 1535

First, make sure that all HTML are rendered, use product ID as an class/id or HTML attribute to distinguish different products.

<li class='game-box showlist'  data-productid='productId' >
    ...
</li>

Then, call getProductDetails, pass in the HTML selector which point to the product. You can use it to update the HTML after the success callback return, something like this:

function getDetails(productlist, selector)
{
    inappbilling.getProductDetails(function(result) {
        var price= result[0].price;
        $(selector).html(price);
    }, errorHandler, productlist);
}

Notice that instead of setting default price to 'free', you might want to use another place holder.

Upvotes: 0

Tom Sebastian
Tom Sebastian

Reputation: 3433

I just rewrote your code as a recursive call:

function render(res)
 {

    var length = res.length;
    var i=0;
    var price;

    function display(){
     var gameOnScreen = "<li class='game-box showlist'  data-tag='" + app_tag + "' >" +
            "<div class='game-box-link' data-id='" + game.ID + "' data-orientation='" + orientation + "' data-ajax='false' data-url='" + link + "' data-transition='none'>" +
            "<img src='" + thumb + "' class='game-thumb'>" +price+
            "</div></li>";
     i++;//incrementing to nextitem, but not triggering next iteration as a loop.
    };
    function getDetails()
    {
            if(res[i].product_id!='Free' && res[i].product_id!='')
            {
                inappbilling.getProductDetails(successHandler2, errorHandler, res[i].product_id);
            }
            else
            {
                price='Free';
                display();//displaying item
            }

    };
    function successHandler2 (result)
    {
        price= result[0].price;
        console.log(price);
        display();//displaying current item
        if(i<length){
            getDetails();//after getting current item's price go for next
        }
    };
    getDetails();//initial call

}

This will step over to next item after completing current item. Also note that I didn't take care of errorHandler

Upvotes: 2

lex82
lex82

Reputation: 11317

Add a callback to getDetails() like this:

function getDetails(productlist, callback)
{
    inappbilling.getProductDetails(function successHandler2(result) {
        callback(result[0].price);
    }, errorHandler, productlist);
}

Now you can work with the price where you call getDetails():

getDetails(res.product_id, function callback(price) {
    // now you can update the DOM to show the actual price.
});

However, I would only show a game in the list after the price has been retrieved (add it to the DOM in the callback). Otherwise it will appear as free for a short time.

Upvotes: 0

Related Questions