datetables 1.9.4 使用心得

Server-side

js

$(document).ready(function() {
    $('#example').dataTable( {
        "processing": true,
        "serverSide": true,
        "ajax": {
            "url": "scripts/post.php",
            "type": "POST"
        },
        "columns": [
            { "data": "first_name" },
            { "data": "last_name" },
            { "data": "position" },
            { "data": "office" },
            { "data": "start_date" },
            { "data": "salary" }
        ]
    } );
} );

serverSide   表明是从服务器端发的数据

url              是数据源

type           不设置默认是GET方式

columns      这里是对应表格的响应的列（比如第一列显示的是 first_name ）

　　　　　　一般来说从服务器传来的数据在js上可能要自己组合一下。columns 还有一些其他属性

 

　　　　　　"class":          "details-control",

　　　　　　"orderable":      false,

　　　　　　"data":           null,

　　　　　　"defaultContent": ""

　　　　　　

　　　　　　"data":function ( data, type, full, meta){data是josn里data} 

服务器传的 json 数据

{
  "draw": 1,
  "recordsTotal": 57,
  "recordsFiltered": 57,
  "data": [
    {
      "DT_RowId": "row_5",
      "first_name": "Airi",
      "last_name": "Satou",
      "position": "Accountant",
      "office": "Tokyo",
      "start_date": "28th Nov 08",
      "salary": "$162,700"
    },
    {
      "DT_RowId": "row_25",
      "first_name": "Angelica",
      "last_name": "Ramos",
      "position": "Chief Executive Officer (CEO)",
      "office": "London",
      "start_date": "9th Oct 09",
      "salary": "$1,200,000"
    },

  ]
}

 

 

　　　　　　"data":    first_name,

　　　　　　"render":function ( data, type, full, meta){是传到data里的值，这里是first_name}