使用json值填充数据表

时间:2018-05-14 18:13:46

标签: javascript jquery jquery-ui datatables

我正在进行数据库搜索并返回一个json。我正在尝试使用数据表显示这些数据,但没有成功。

这是我的代码:

HTML

<table id="table">
    <thead>
        <tr>
            <th width="5%"></th>
            <th width="5%">Id</th>
            <th width="10%">Cat</th>
            <th width="15%">Name</th>
            <th width="5%">Code</th>
        </tr>
    </thead>
</table>

JS

var data = dados.responseJSON[2].Value[0];

settings.myTable.DataTable({
    data: dados.responseJSON[2].Value[0], 
    columns: [
        { data: 'Id' },
        { data: 'Id' },
        { data: 'Cat' },
        { data: 'Name' },
        { data: 'Code' },        
    ]

    /****************
         WHAT MORE??
     *****************\

});

我的变量dataajax成功,当我console.log data时,我可以看到值。拥有所有json对象,并且是th表中的确切名称。

我认为我需要插入更多代码来填充表格。当我运行此代码时,不会返回任何错误。

我做错了什么?

1 个答案:

答案 0 :(得分:0)

确保以对象数组的格式从json获取数据, e.g:

var data=
    [
        {
            "name":    "Tiger shroff",
            "place":   "Mumbai",
            "salary":   "3,00,00,000",
            "age":      "27",
            "office":   "Lower Parel",
            "id":       "120"
        },
        {
            "name":    "Salman Khan",
            "place":   "Central Jail",
            "salary":   "1,00,00,000",
            "age":      "51",
            "office":   "Mumbai",
            "id":       "420"
        }
    ]

现在,您可以根据对象中的键在datatable函数中定义列。

$('#table').DataTable( {
data: data,
columns: [
      { data: 'name' },
      { data: 'place' },
      { data: 'salary' },
      { data: 'id' }
    ]
});