美文网首页
jQuery datatables 的ajax数据源

jQuery datatables 的ajax数据源

作者: 寻找无名的特质 | 来源:发表于2021-08-27 06:00 被阅读0次

Datatables 支持多种格式的数据源,在配置中ajax配置项中,使用dataSrc可以指定数据源的来源。数据源需要配合columns属性使用,columns是列显示数组,指定数据项的来源和显示方式。如果dataSrc没有指定,数据源是data,比如下面的数据:

{
  "data": [
    {
      "Name": "张三",
      "Age": 20
    },
    {
      "Name": "李四",
      "Age": 30
    }
  ]
}

如果数据源是数组,那么数据源需要设置为空,比如下面的数据:

[
  {
    "Name": "张三",
    "Age": 20
  },
  {
    "Name": "李四",
    "Age": 30
  }
]

上面这些情况中,columns需要设置为:

$(document).ready(function () {
            var datatable1 = $("#table_id").dataTable({
                "ajax": {
                    "type": "GET",
                    "url": "content/demodata/demo2.json",
                    "dataSrc": "People",
                    "data": data
                },
                columns: [{ data: "Name" }, { data: "Age" }]
            });
        });

如果数据是纯数组:

[
  [
    "张三",
    20
  ],
  [
    "李四",
     30
  ]
]

那么columns定义数组的列编号,如果不定义,按缺省顺序:

$("#table_id2").dataTable({
                "ajax": {
                    "type": "GET",
                    "url": "/content/demodata/demo3.json",
                    "dataSrc": "",
                },
                columns: [{ data: 1 }, { data: 0 }]
            });

相关文章

网友评论

      本文标题:jQuery datatables 的ajax数据源

      本文链接:https://www.haomeiwen.com/subject/mnhsiltx.html