0

ajax リクエストの結果を既存のテーブルに配置する必要があります。ここに私のajaxリクエストがあります

$("input#order").click(function(){
    var idmenu  = $("#idmenu").val();
    var menu    = $("#idmenu :selected").text();
    var qty     = $("#qty").val();

    $.ajax({
        type    :'POST',
        url     :'<?php echo base_url();?>index.php/welcome/process',
        data    :'idmenu='+idmenu+'&menu='+menu+'&qty='+qty,
        beforeSend:function(){
            $("#result").html('<img src="<?php echo base_url();?>assets/loading.gif"/>');
        },
        success:function(result){
            //result is json format
        }
    });

});

ここにajaxリクエストからのjson形式があります

{"itemname":"product1","qty":"3","prices":"4500"}

ここに私のテーブルフォーマットがあります

<table class="list-order">
    <tr>
        <th class="order">order</th>
        <th class="qty">qty</th>
        <th class="pice">price</th>
    </tr>
    //how to append ajax result here
    <tr>
        <td colspan="2"></td>
        <td align="right"><input type="submit"  size="25" id="process" value="Proses"/></td>
    </tr>
</table>

私は ajax のような結果を追加したい

<tr>
    <td></td>
    <td></td>
    <td></td>
</tr>

タグの内側ではありません。

<tr>
   <td>result is not here</td>
</tr>

最終結果はこのようになります

<table class="list-order">
    <tr>
        <th class="order">order</th>
        <th class="qty">qty</th>
        <th class="pice">price</th>
    </tr>
    <!-- result look like this -->
    <tr>
        <td>product1</td>
        <td>2</td>
        </td>4500</td>
    </tr>
    <!-- end result-->
    <tr>
        <td colspan="2"></td>
        <td align="right"><input type="submit"  size="25" id="process" value="Proses"/></td>
    </tr>
</table>
4

2 に答える 2

5

JSON の正確な形式を知らなければ、決定的な答えを出すことは困難です。ただし、行を表すオブジェクトの JSON 配列があると仮定すると、その配列を反復処理し、オブジェクトごとに次の操作を行う必要があります。

  • 新しい<tr>要素を作成します -var $tr = $('<tr/>');
  • 情報の項目ごとに ( ごとに 1 つの項目を想定し<td>ています)、<td>要素を作成し、その内容を設定します - var $td = $('<td/>').html(x.y)(xは現在のオブジェクト、yはオブジェクト内のフィールド)、それを行に追加します - $tr.append($td);。
  • 既存のテーブルの最後の行の前に行を追加 -$('.list-order tr:last').before($tr);

質問で提供された追加情報に続いて、次のコードは必要なことを行う必要があります。

success: function(result) {
    //result is json format
    var $tr = $('<tr/>');
    $tr.append($('<td/>').html(result.itemname));
    $tr.append($('<td/>').html(result.qty));
    $tr.append($('<td/>').html(result.prices));
    $('.list-order tr:last').before($tr);
}
于 2012-07-18T09:54:51.257 に答える
0

あなたのajax成功関数で：

success:function(result){
            //create new tr
            var $tr = $('<tr>');
            //extract value from result and put in tr
            $tr.html(result.someVal);
            //find first <tr> and append new tr after it
            $('table.list-order tr:first').after($tr);
         }
于 2012-07-18T09:58:35.247 に答える