首页 > Bootstrap表格插件Bootstrap Table配置教程 > bootstrap table Total/Data Field服务器返回JSON格式

bootstrap table Total/Data Field服务器返回JSON格式

通过设置bootstrap table 的totalField 和 dataField 属性,来指定服务器返回数据的JSON格式,totalField默认total,dataField默认rows,JSON格式如下。

{
  "total": 3,
  "rows": [
    {
      "Id": 1,
      "ProductName": "香蕉",
      "StockNum": "100"
    },
    {
      "Id": 2,
      "ProductName": "苹果",
      "StockNum": "200"
    },
    {
      "Id": 3,
      "ProductName": "车厘子",
      "StockNum": "2010"
    }
  ]
}

我们可以把返回的JSON格式按我们自己的习惯返回给bootstrap table ,格式如下:

{
  "count": 3,
  "data": [
    {
      "Id": 1,
      "ProductName": "香蕉",
      "StockNum": "100"
    },
    {
      "Id": 2,
      "ProductName": "苹果",
      "StockNum": "200"
    },
    {
      "Id": 3,
      "ProductName": "车厘子",
      "StockNum": "2010"
    }
  ]
}

//设置bootstrap table totalField 为count ,dataField 为 data
 $('#table').bootstrapTable({
            url: '/package/bootstrap-table-1.14.1/data.json',
            pagination: true,//开启分页
            search: true, //开启刷选
            columns: columns,
            totalField:"count",
            dataField:"data"
        });

看明白这两个属性的作用了吗?