标签：sla   jquer   ash   特性   info   css   表格   二维   san   

DataTable 选项说明

DataTable 选项说明

• 特性
  • jQueryUI:true/false:控制是否使用jqueryUI样式，需要引入jQueryUI的CSS
  • autoWidth:true/false:控制Datatables是否自适应宽度,建议宽度可以确定的时候尽量自行确定，自适应宽度会导致表格加载速度变慢
  • info:true/false:控制是否显示表格左下角的信息
  • lengthChange:true/false:是否允许用户改变表格每页显示的记录数
  • ordering:true/false:是否允许Datatables开启排序
  • paging:true/false:是否开启本地分页
  • processing:true/false:是否显示处理状态(排序的时候，数据很多耗费时间长的话，也会显示这个)
  • scrollX:数值:设置水平滚动
  • scrollY:数值:设置垂直滚动
  • scrollCollapse:true/false:是否开启垂直滚动条
  • serverSide:true/false:是否开启服务器模式
  • deferRender:true/false:d控制Datatables的延迟渲染，可以提高初始化的速度
• 数据
  • ajax:异步数据:增加或修改通过Ajax提交到服务端的请求数据

    如果当做一个对象

  • data:本地数据:用来显示表格的数据

    data的数据可以是二维数组，也可以是对象数组

    • 二维数组

      $(‘#example‘).dataTable( {
                            "data": [
                                [ "Tiger Nixon", "System Architect", "$3,120", "2011/04/25", "Edinburgh", 5421 ],
                                [ "Garrett Winters", "Director", "$8,422", "2011/07/25", "Edinburgh", 8422 ],
                                // ...
                            ]
                        } );

    • 对象数组

      $(‘#example‘).dataTable( {
                            "data": [
                                {
                                    "name":       "Tiger Nixon",
                                    "position":   "System Architect",
                                    "salary":     "$3,120",
                                    "start_date": "2011/04/25",
                                    "office":     "Edinburgh",
                                    "extn":       5421
                                },
                                {
                                    "name": "Garrett Winters",
                                    "position": "Director",
                                    "salary": "5300",
                                    "start_date": "2011/07/25",
                                    "office": "Edinburgh",
                                    "extn": "8422"
                                },
                                // ...
                            ],
                            "columns": [
                                { "data": "name" },
                                { "data": "position" },
                                { "data": "office" },
                                { "data": "extn" },
                                { "data": "start_date" },
                                { "data": "salary" }
                            ]
                        } );

DataTable 选项说明

标签：sla   jquer   ash   特性   info   css   表格   二维   san   

原文地址：https://www.cnblogs.com/rangger/p/9349884.html