1

jQuery を使用してショッピング カートを更新し、返された json オブジェクトを使用してこれをループし、ページに「新しい」更新されたカートを表示します。

私のajax関数は以下のとおりです-これはjsonオブジェクトを返しますが、これをビューに戻す方法が少しわかりません

function updateCart( qty, rowid ){
$.ajax({
        type: "POST",
        url: "/cart/ajax_add_item",
        data: { rowid: rowid, qty: qty },
        success: function(data){
                      // use this data and re-display on the page
        }
    });
}

jQueryを使用してこのコンテンツをページに表示する最良の方法は何ですか?

// 更新 - json 構造の例

{
    "722fc276f5b5f44bdad431d89c95019f": {
        "rowid": "722fc276f5b5f44bdad431d89c95019f",
        "id": "4",
        "qty": "2",
        "price": "255.00",
        "name": "Apple iPhone 4S",
        "options": {
            "condition": "Working",
            "merchant": "BBW",
            "attributes": "16GB, Any"
        },
        "custom": {
            "merchant_url": "http:\/\/www.buybackworld.com",
            "url": "bbw\/sell-apple-iphone-4s-16gb-at-t-a1387\/10018.html",
            "image": "\/assets\/images\/devices\/iphone-4s.jpg",
            "merchant_id": "63",
            "merchant": "bbw",
            "device_id": "354"
        },
        "subtotal": 510
    }
}
4

1 に答える 1

1

ある種のレンダリング関数が必要です。

var render = function (json) {
    var _html = '<div class="cart">';
    if (json) {
        $.each(json, function (i, item) {          // loop through the json data
          _html += '- ' + item.name + ' (' + item.price + ')';
        })
    }
    _html += '</div>';
    $('#myCartContainer').html(_html);             // replace container with new cart data
};


$.ajax({
    type: "POST",
    url: "/cart/ajax_add_item",
    data: { rowid: rowid, qty: qty },
    success: render                                // "render" when data received
});
于 2013-10-17T15:00:29.463 に答える