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 回答