动态设置jquery数据表列的数据源

时间:2017-01-02 09:18:50

标签: javascript jquery arrays json datatables

有没有办法可以动态设置数据表列的数据源?就像我通过硬编码每个属性名称来设置columns.data

$.ajax({
    data: JSON.stringify(data),
    url: urlGetProviderQualificationTimeData,
    type: 'POST',
    contentType: "application/json; charset=utf-8",
    success: function (obj) {
        if (obj.success) {
            $('#tblProds').dataTable({
            data: obj.data.ProdsDetails,
            columns: [
                { "data": "PName" },
                { "data": "PTime" }  //hardcoded mapping of properties     
            ]
            });
        }
    },
});

ProdsDetails示例数组:

Array[2]
0:Object
    PName:"ATT",
    PTime:"6.48"   
1:Object
    PName:"CENTURYLINK",
    PTime:"3.67"

有没有办法摆脱这种硬编码的属性和列映射?

2 个答案:

答案 0 :(得分:4)

这是你的数组:

var array=[
             {PName:"ATT",PTime:"6.48" },
             {PName:"CENTURYLINK",PTime:"3.67"}
          ];

现在,您应该获得所有keys并构建最终数组:

var obj=array[0];
var keys=[];
for(var k in obj) 
    keys.push({"data":k});

现在,keys数组看起来像这样:

[
   {"data":"PName"},
   {"data":"PTime"}
]

最后一步是将数组分配给columns的{​​{1}}属性:

DataTable

现在看起来应该是这样的:

columns:keys

希望这有帮助!

答案 1 :(得分:0)

我遇到了同样的问题并通过为json属性创建额外的columns.data数组来解决这个问题。使用php函数循环标题并将其放入json数组中。