1

我正在使用启用 DataTable 的表构建一个简单的页面。

来自我的服务器的数据如下所示:

[{"name": "John","salary": 2000,"bonus1": 100,"bonus2": 100},
 {"name": "Jack","salary": 2500,"bonus1":   0,"bonus2": 200},
 {"name": "Bill","salary": 2000,"bonus1": 300,"bonus2": 300}
]

我需要添加并计算第五列,它将代表员工工资的百分比值(工资/所有工资的总和)

fnPreDrawCallback我能够修改oSettings.aoData时,console.log(oSettings.aoData)我得到正确的值,但表中的该列为空。

我的fnPreDrawCallback功能如下所示:

"fnPreDrawCallback": function (oSettings) {
          iTotal = [0, 0, 0]; //declared in $(document).ready
          var dataLength=oSettings.aoData.length;
            for (var i = 0; i < dataLength; i++) {
                iTotal[0] += oSettings.aoData[i]._aData.salary;
                iTotal[1] += oSettings.aoData[i]._aData.bonus1;
                iTotal[2] += oSettings.aoData[i]._aData.bonus2;
            }

          for (i = 0; i < dataLength; i++) {
                oSettings.aoData[i]._aData.percent=(oSettings.aoData[i]._aData.salary / iTotal[0] * 100).toFixed(2)+'%';

            }
          console.log(oSettings.aoData);
        },

这是我的代码: http: //live.datatables.net/umezez/13/edit

我的问题:我应该在哪里更新我的数据,以便更新在表格中可见?

我想避免使用选择器和更新 DOM 的内容,因为我希望能够使用 TableTools 或服务器端处理导出我的表。

4

3 回答 3

1

我不明白您为什么不简单地做这两件事,更新aoData(以便您可以导出)并自己更新html(以便正确显示)

我知道这是一个黑客,但它应该工作:)

http://live.datatables.net/umezez/16/edit

使用 fnUpdate() 编辑

http://live.datatables.net/umezez/23/edit

于 2012-10-08T22:28:06.147 回答
0

这是答案

http://live.datatables.net/umezez/19

基本上你需要先计算工资总额(我将你的数据移动到一个变量并在表格呈现之前计算总数)然后你需要在 % 列上使用 fnRender 函数来计算和显示你的百分比像这样(下面是 %) 的列定义

 {
            "sTitle": "%",
            "bVisible": true,
            "sType": "string",
            "sWidth": "50px",
            "sClass": "center percent",
            "mData": "percent",
          "fnRender": function(o) {return o.aData.salary/totalSalaries}
        }
于 2012-10-09T21:37:58.250 回答