如何将多个数据放入数据表列?

时间:2013-03-02 12:39:22

标签: javascript json jquery-datatables

我正在使用Datatables来表示来自JSON的数据。 我的JSON如下:

[{"name": "John Doe", "email": "john@gmail.com", "address" : "blah"}]

在Datatables中,我可以使用以下内容轻松地在3个差异列中显示这3个信息:

columnDefs = [ 
                { "mData": "name", "aTargets":[0] },
                { "mData": "email", "aTargets":[1] },
                { "mData": "address", "aTargets":[2] }
             ]; 

但问题是我想在第1列显示“name”和“email”,然后在第2列显示“address”。 我怎样才能做到这一点?请指导。

4 个答案:

答案 0 :(得分:12)

您可以使用函数来获取和打印所需的任何数据,而不是将名称或电子邮件放在列定义的第一列中。有关详细信息,请参阅此页面上的mData部分:https://datatables.net/usage/columns。在我下面的例子中,我使用aoColumns,因为我以这种方式测试了我的答案;但在引用的链接中,他们使用了aColumnDefs并提供了类型和dataToSet字段的详细说明。无论你使用aoColumns还是aoColumnDefs,这种方法都应该有助于任何人阅读这个答案。

例如,使用aoColumns而不是aoColumnDefs:

aoColumns = [ 
    { "mData": getNameAndEmail },
    { "mData": "address" }
]; 

然后在JavaScript范围中定义getNameAndEmail函数,它接受三个参数:传回的数据,对数据的操作类型,以及类型是否“设置”,然后是要设置的数据。

function getNameAndEmail(data, type, dataToSet) {
    return data.name + "<br>" + data.email;
}

答案 1 :(得分:9)

为了使它更短,你可以像这样写

"aoColumns": [
    { "mData": "i_id" },
    { "mData": "i_name" },
    { "mData": function (data, type, dataToSet) {
        return data.i_id + "<br/>" + data.i_name;
    }}
],

和结果

enter image description here

答案 2 :(得分:6)

columnDefs = [ 
            { 
             data: {name : "name", email : "email", address : "address"},
             mRender : function(data, type, full) {
                return data.name+' '+data.email+' '+data.address; 
              } 
            }
         ]; 

上述代码可以在数据表的列中呈现多个数据。

答案 3 :(得分:1)

[您可以使用如下语法:
对我有用。]
     "columnDefs":[{ "targets":0,//column index "data":"first_name", "render":function(data,type,row){ return data+' '+row['last_name']; } }]

[谢谢]