2

我正在寻找一个支持按列排序和分组的 jQuery 解决方案；然后，在页脚部分，应该可以显示上述所有值的总和。

示例：我有三列：国家、日期和销售额：

US     20120714       50
DE     20120714       40
BR     20120714       30
US     20120715       60
DE     20120715       60
BR     20120715       20

如果我按国家排序：

BR     20120714       30
BR     20120715       20
                      50
DE     20120714       40
DE     20120715       60
                     100
US     20120714       50
US     20120715       60
                     110

如果我按日期排序：

BR     20120714       30
DE     20120714       40
US     20120714       50
                     120
BR     20120715       20
DE     20120715       60
US     20120715       60
                     140

等等...

有可用的插件吗？

4

3 回答 3

4

如前所述，Datatables 是一个很好且易于使用的 JQuery 插件，可以满足您的需求。它支持开箱即用的排序，也可以进行分组。请参阅此示例。
您还可以修改页脚以显示列的总和，如本例所示。

但是，您也可以使用该fnDrawCallback功能。每次绘制表格时都会调用它，并为您提供修改应如何绘制的可能性。

例子： 

"fnDrawCallback": function (oSettings) {
    // Get all rows of your table
    var nTrs = $tableElement.find('tbody tr');
    // Enumerate all rows
    var sum = 0;
    for (var i = 0; i < nTrs.length; i++) {
         var iDisplayIndex = oSettings._iDisplayStart + i;
         var dataIndex = oSettings.aiDisplay[iDisplayIndex];
         sum += oSettings.aoData[dataIndex]._aData.{your item};
    }
    // Insert sum at the end
    $tableElement.find(' tbody tr:last').after('<p>'+sum+'</p>');

在此示例中，变量$tableElement包含数据表实例的 JQuery 对象。

于 2012-07-17T12:17:31.310 回答
1

很明显你需要尝试 serach，它非常容易使用谷歌，在这里你需要自己尝试然后你需要问你关于你的“问题”的问题。

在这里你必须学习如何钓鱼不给你免费的鱼:)

你问题的另一面很广泛，我的意思是很多人会给你很多插件，而且都是正确的，但是你会选择“你”的答案作为“你”想要的，而不是因为那个答案真的正确或最好。

所以这就是为什么你会降低选票的原因。（如我所想或所见）

无论如何，你可以看看你是否想要这样的插件：http: //datatables.net/release-datatables/examples/plug-ins/sorting_sType.html

或其他方式：http ://datatables.net/ 也许您需要编码（求和）。

这里有很多插件：http ://www.jquery4u.com/plugins/30-amazing-jquery-tables/#.UAUUD_XU6Iw

自己探索它们我希望你能得到一些有用的东西，我用谷歌搜索很容易得到这些链接，用傻话:)

于 2012-07-17T07:30:29.047 回答
1

我宁愿不要用沉重的逻辑来占领客户，它会口吃而且很慢。

只需执行所有排序/分组/计数服务器端，并为您的客户端提供所有已处理并准备显示的数据。

为此，您只需要一个简单的 ajax 调用和一堆参数：不需要在不需要的地方施展魔法。

于 2012-07-17T12:22:48.803 回答