如何将绑定内部json列表绑定到html行jqMobile表

时间:2013-11-29 05:19:55

标签: javascript jquery json jquery-mobile html-table

我想知道如何将内部json列表“pslList”绑定到html行

    <table data-role="table" id="productOrders"  data-mode="reflow">
<thead>
                                <tr>
                                  <th>Code</th>
                                  <th>Name</th>
                                  <th>Price</th>
                                  <th>Qty.</th>
                                  <th>Ext</th>
                                </tr>
                              </thead>
                          <tbody>
                            <tr>
                              <th>1</th>
                              <td></td>
                              <td></td>
                              <td></td>
                              <td></td>
                              <td></td>
                            </tr>
                            </tbody>
                          </table>
json
    [
        {
            "amount": 12,
            "podate": "2013-11-28T00:00:00",
            "ponumber": 7,
            "pslList": [
                {
                    "ext": 210,
                    "ponumber": 7,
                    "prodcd": "ffrff",
                    "price": 70,
                    "prodname": "games",
                    "qty": 3
                },
                {
                    "ext": 70,
                    "ponumber": 7,
                    "prodcd": "rrfrr",
                    "price": 14,
                    "prodname": "DVDs",
                    "qty": 5
                }
            ],
            "vendorno": 1
        }
    ]

1 个答案:

答案 0 :(得分:0)

检索json后,您可以遍历列表,创建行,然后将它们添加到表中:

var $table = $('#productOrders tbody');
var plist = json[0].pslList;
for (i in plist) {
    var row = $('<tr><td>' + plist[i].prodcd + '</td><td>' + plist[i].prodname + '</td><td>' + plist[i].price + '</td><td>' + plist[i].qty + '</td><td>' + plist[i].ext + '</td></tr>');       
    $table.append(row);
}