将数据加载到我不知道列的数据表中

时间:2014-11-27 10:24:38

标签: javascript php jquery ajax json

我正在使用AJAX响应从数据库中获取数据来创建数据表。

我收到以下JSON数据:

[
    {
        "id": "11105",
        "name": "Gummy Drop (iPhone, Free, ROW except CN, 72.3MB, w"
    },
    {
        "id": "11107",
        "name": "Gummy Drop (iPad, Free, ROW except CN, 72.3MB, w/ "
    },
    {
        "id": "4274",
        "name": "Z-Redirect Non-Targeted Traffic Dragon City Mobile"
    },
    {
        "id": "6484",
        "name": "Z-Redirect Non-Targeted Traffic Dragon City Mobile"
    }
]

问题是,我可能不知道将从AJAX响应中获得什么数据。

所以我正在提取JSON数组的键,以便创建标题,我成功地这样做了。

这是我的代码:

$('#load').click(function()
    {
        var v = $('#drp_v').val();
        var cnt = $('#drp_cnt').val();
        var ctg = $('#drp_ctg').val();
        alert("version :"+v+" category :"+ctg+" country :"+cnt);
        $.post("ajax.php",{'version':v,'category':ctg,'country':cnt,'func':'show_datatable'},
                        function(data)
                        {
                            var aColumns = [];
                            var columns = [];
                            for(var i = 0; i < data.length; i++) 
                            {
                                if(i>0)
                                    break;
                                keycolumns = Object.keys(data[i]); 
                                for(j = 0; j < keycolumns.length; j++)
                                {
                                    alert(keycolumns[j]);
                                    if($.inArray(keycolumns[j],aColumns.sTitle)<=0)
                                    {
                                        aColumns.push({sTitle: keycolumns[j]}) //Checks if
                                        columns.push(keycolumns[j]) //Checks if
                                    }                                  
                                }

                            }

                            var oTable = $('#jsontable').dataTable({
                                "columns":aColumns,
                                "sDom": 'T<"clear">lfrtip',
                                    "oTableTools": {
                                        "aButtons": [
                                            {
                                                    "sExtends": "csv",
                                                    "sButtonText": "CSV",
                                             }
                                        ]
                                    }
                            });
                            oTable.fnClearTable();
                            for(var i = 0; i < data.length; i++) 
                            {
                                for(var c = 0; c < columns.length; c++) 
                                {
                                    oTable.fnAddData([
                                            data[i].columns[c]]); 
                                }
                            }
                        },'json');
    });

如您所见,var columns = [];实际上包含了我获得的JSON数组的键。所以var columns的值是这样的:

['id','name','description'];

因此,如果我们假设id,name和description是三个键,那么不要使用此代码:

for(var i = 0; i < data.length; i++) 
 {
    oTable.fnAddData([
                      data[i].id,
                      data[i].name,
                      data[i].description]); 
}

我已使用此代码

for(var i = 0; i < data.length; i++) 
 {
   for(var c = 0; c < columns.length; c++) 
    {
        oTable.fnAddData([
                          data[i].columns[c]]); 
    }
}

以便可以将数据作为存储在var列中的动态键值加载。

但我认为我犯了一些错误。我哪里出错?

2 个答案:

答案 0 :(得分:4)

使用此代码:

var row = []
for(var i = 0; i < data.length; i++) {
    for(var c = 0; c < columns.length; c++) {
            row.push( data[i][columns[c]] ) ;
    }
    oTable.fnAddData(row);
    row = [];
} 

答案 1 :(得分:1)

它应该是“ data [i] [columns [c]] ”,而不是“data [i] .columns [c]”。