首页 > 解决方案 > 使用 json 值填充数据表

问题描述

我正在进行数据库搜索并返回一个 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.logdata我可以看到这些值。拥有所有 json 对象,并且是我th表中的确切名称。

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

我做错了什么?

标签: javascriptjqueryjquery-uidatatables

解决方案


Make sure you have data from your json in the format of array of objects, 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"
        }
    ]

Now you can define your columns in datatable function as per keys in the object.

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

推荐阅读