难以将JSON数据绑定到Jquery Datatable

本文关键字:Jquery Datatable 数据绑定 JSON | 更新日期: 2023-09-27 18:34:29

我在绑定JSON数据以构建数据表时遇到困难。

我的 JSON 如下:

[
  {
    "ID": 1,
    "Number": "2",
    "Name": "Avinash"
  },
  {
    "ID":2,
    "Number":"21",
    "Name":"XYZ"
  },
  {
    "ID": 3,
    "Number": "20",
    "Name": "KRR"
  }
]

我将其绑定到 jquery 数据表,如下所示:

 $(document).ready(function () {
            $('#table_id').dataTable({
                "bProcessing": true,
                "bServerSide": true,
                "sAjaxSource": '<%:Url.Action("LoadData","Home")%>'
            });
            $('#table_id').css("width", "100%")
        });

我的表结构如下:

<table id="table_id" border="0" class="display" cellpadding="1" cellspacing="1" align="center">
 <thead>           
            <tr>
                 <th>ID</th>
                <th>Number</th>
                <th>Name</th>
            </tr>
        </thead>
    </table>

我收到如下错误:

  Datatables Warning(tableid="table_id"):Requested Unknown Parameter'0' from the datasource for row 0

请帮忙..

public ActionResult LoadData()
                {
                    var Data = new DataTable();
                    Data=DataModel.LoadData();
                    var JsonData = JsonConvert.SerializeObject(Data, Formatting.None);
                    return Json(new
                    {
                        aaData = JsonData
                    }, JsonRequestBehavior.AllowGet);
                }

难以将JSON数据绑定到Jquery Datatable

经过简短的调查,由于您的 JSON 是对象,因此您应该提供列定义 -

杰森:

{ "aaData": [
  {
    "ID": 1,
    "Number": "2",
    "Name": "Avinash"
  },
  {
    "ID":2,
    "Number":"21",
    "Name":"XYZ"
  },
  {
    "ID": 3,
    "Number": "20",
    "Name": "KRR"
  }
]}

.js:

var oTable = $('#table').dataTable({
     "bProcessing": true,
     "sAjaxSource": '<%:Url.Action("LoadData","Home")%>',
     "aoColumns": [
                  { "mData": "ID" },
                  { "mData": "Number" },
                  { "mData": "Name" }
               ]
      });

请参阅数据表源中 ajax/objects.html 下的示例。