1

既存のテーブルにテーブル行を追加しようとしています。

これが私のテーブルの構造です。

<div id="productListContainer">
    <table id="productListTable">
            <thead>
                <tr>
                    <td>
                        #
                    </td>
                    <td>
                        Product Name
                    </td>
                    <td>
                        Price
                    </td>
                    <td>
                        Quantity
                    </td>
                </tr>
            </thead>
            <tbody>
            </tbody>
        </table>
</div>

次の関数を使用して、新しいテーブル行を追加しようとしています。

function(data) {
                if (data.productAdded !== "undefined") {
                  $("#productListTable tr").append().html(data.productAdded);
                }
              }

これにより、1行が正常に追加されます。ただし、同じ関数をトリガーする別のアイテムを選択すると、追加されたテーブル行が新しいアイテムで上書きされます。

私はこの関数をajax呼び出し内で成功メッセージとして使用しています。

'data'は、それ自体が文字列としてのテーブル行であるproductAddedを含むJSONオブジェクトです。

4

2 に答える 2

3

あなたがしたいのは、私が想定しているテーブルの本体に行を追加することです。このためにあなたはこれをする必要があるでしょう-

$("#productListTable tbody").append(html_string);

テーブルのヘッダーと一致するhtml_stringために必要なすべての要素を含める必要があり<tr>ます。<td>

参考文献-

于 2012-06-07T17:41:25.227 に答える
2

パラメータなしで呼び出す.append()と、何も追加されず、元のjQueryオブジェクトが返されます。したがって、電話をかけると、の内容.html()が置き換えられます。<tr>

そのはず：

$("#productListTable tr").append(data.productAdded);

編集<tr>：それは内部に追加されます<thead>。に追加したいと思います<tbody>。

$("#productListTable tbody").append(data.productAdded);

編集2<tr> ：テーブルに追加するときは、文字列にaと正しい数の<td>sがあることを確認する必要があります。

于 2012-06-07T17:40:50.930 に答える