1

私はデータテーブルが初めてです...

それぞれがサブ (詳細) 行を持つ行のグリッドを作成しています。mysql データベースのサーバー側データを使用しています。すべてのサブ行を含む JSON として返されます。サブ行から列を合計して、「メイン」グリッド行を作成する必要があります。Datatables がこれを実行できるかどうか、またはどのように実行されるかはわかりません...

JQuery関数でJSONを取得することから始めることを考えています。次に、ループを使用して必要なデータを合計し、それを配列データとしてグリッドに渡します。最後にグリッドをレンダリングします。

これはベスト プラクティスですか、それとも Datatables はよりスマートな方法で実行できますか?

-- サブ行の概念は、http: //datatables.net/blog/Drill-down_rowsで確認できます--

4

1 に答える 1

1

このようなものを完成させました。必要なすべてのデータを返し、「詳細」情報を非表示の div の最後の列に入れました。次に、行クリックを使用して、その情報を詳細行に入れました。

//In the example the table the first column has a plus icon that gets replace with a minus icon
// the last column added a hidden div that contained the details.
$("#results").dataTable({
    "fnCreatedRow": function (nRow, aData, iDataIndex) {
        //Attach the on click event to the row
        var oTable = this;
        $("td:eq(0) span", nRow).on("click", function () {
            //First column has a image with the jQuery UI plus icon
            if ($(this).hasClass("ui-icon-circle-plus")) {
                //The details information is stored in the last column in a hidden div with the class wrapper
                //Grab the hidden information and append that to the new row.
                oTable.fnOpen(nRow, $(".wraper", nRow).html(), "details");
            } else {
                oTable.fnClose(nRow);
            }
            $(this).toggleClass("ui-icon-circle-plus ui-icon-circle-minus");
        });
    }
});
于 2013-03-24T02:11:00.620 に答える