dataTable 参数说明
下面是一些常用的参数列表,比较常用或者有价值的标示为绿色.
功能参数(Features)
参数名 |
说明 |
参考值 |
默认值 |
autoWidth |
定义是否由控件自动控制列宽 |
Boolean |
true |
deferRender |
定义在render时是否仅仅render显示的dom,在显示大量数据的情况下强烈建议设为true,显示少量数据或者真翻页方案可以设为false,注意在设为true时无法通过函数获取所有行的dom对象—因为它们并不存在. |
Boolean |
false |
info |
控制总数信息(标准界面右下角显示总数和过滤条数的控件)的显隐 |
Boolean |
true |
lengthChange |
控制是否能够调整每页的条数,如果设为false,标准的每页条数控制控件也会被隐藏. |
Boolean |
true |
ordering |
全局控制列表的所有排序功能. |
Boolean |
true |
paging |
全局控制列表的翻页功能,如果设为false,所有的默认翻页控件会被隐藏 |
Boolean |
true |
processing |
控制是否在数据加载时出现”Processing”的提示,一般在远程加载并且比较慢的情况下才会出现. 样式需要定义,否则比较丑. |
Boolean |
false |
scrollX |
控制在列过多过宽是,是否出现水平滚动条.注意使用这个参数时最好关闭响应式设计 |
Boolean |
false |
scrollY |
定义一个高度,当列表内容超过这个高度时,显示垂直滚动条,这个高度不算表头和翻页搜索等工具条的空间.支持数字或者css写法比如: 200或者’200px’ |
Number / String |
无 |
searching |
控制控件的搜索功能,如果为false,控件的搜索功能被完全禁用,而且默认搜索组件会被隐藏. |
Boolean |
true |
serverSide |
当设为true时,列表的过滤,搜索和排序信息会传递到Server端进行处理,实现真翻页方案的必需属性.反之,所有的列表功能都在客户端计算并执行 |
Boolean |
false |
数据参数(Data)
参数名 |
说明 |
参考值 |
data |
以Javascript数组对象方式设定列表显示数据 |
数组对象 |
ajax |
String模式: 直接传入一个string作为远程ajax请求路径 |
String |
|
对象模式: 支持JQuery.ajax函数的参数设置,支持type,url等标准参数. 例如: $('#example').dataTable( { "ajax": { "url": url, "type": "POST" } } ); |
JQuery ajax 函数对应参数 |
ajax.data |
和标准JQuery.ajax的data参数作用类似,但效果有所不同.仅当 serverSide参数为true的时候,参数属性才有意义,当serverSide开启,DataTables组件会自行封装一个信息类发送给服务 端,而ajax.data仅仅是对这个信息类进行调整和添加. 添加方式, ajax.data可以直接赋值一个对象,这个对象的属性会添加到原信息类里面去一起发送到服务端.例如: $('#example').dataTable( { "ajax": { "url": "data.json", "data": { "user_id": 451 } } } );
另外一种选择是传入一个方法,方法的参数就是当前发送到服务器的信息类,在方法中可以修改这个信息类. $('#example').dataTable( { "ajax": { "url": "data.json", "data": function ( d ) { d.extra_search = $('#extra').val(); } } } ); |
对象或者方法 |
ajax.dataSrc |
定义服务器返回对象里面保存数据的属性名称,默认为data,也即是说,在返回的Json数据中,所有列表数据保存在data属性中,这个属性不太建议修改. |
配置参数(Options)
参数名 |
说明 |
参考值 |
默认值 |
|||
deferLoading |
这个参数只有在ServerSide为Ture的时候才有作用,主要是针对列表已经通过HTML显示了一部分数据,而通知远程加载可以忽略这部分数据,在实际使用中这种情况并不常见. |
Number /Array |
false |
|||
destroy |
设为ture时通知dataTable函数完全重新建立一个新的控件实例,在一个页面内反复对同一个控件加载dataTable函数并且想重新建立控件时使用. |
Boolean |
false |
|||
displayStart |
列表初始显示的行索引,根据给出的行索引会自动翻页,比如一个每页10个的列表,那么给出20可以让其翻到第二页 |
Number |
无 |
|||
dom |
比较复杂的配置项,简言之就是通过一个自定义的字符串来定义DataTables里面所有组件的显示,位置和显隐. 具体请详见: http://datatables.net/reference/option/dom |
String |
“lfrtip” |
|||
lengthMenu |
定义页面长度组件里面的选项. |
Array |
[ 10, 25, 50] |
|||
orderCellsTop |
当然表头有多层td组成的时候,必须定义哪一个td的数据用于排序,false表示底部td,true表示顶部td. 比如以下情况:
true的时候排序会用2.1, false的时候排序会用2.2. |
Boolean |
false |
|||
orderClasses |
定义是否排序的列进行高亮显示 |
Boolean |
true |
|||
order |
定义列表的初始排序设定,为一个2维数组,子数组包括2个值,列索引和排序方向(asc/desc): 例如 "order": [[ 0, 'asc' ], [ 1, 'asc' ]] |
Array |
[[0, 'asc']] |
|||
orderMulti |
控制是否支持多重排序,如果为true,可以通过shift+点击列头实现多重排序,或者通过API实现,否则禁用该功能. |
Boolean |
true |
|||
orderFixed |
自定义固定的排序策略,该策略在任何排序操作中总是起效.可以通过对一个列的固定排序(可以是隐藏的列)来定义列表默认的排序策略. 数组方式,定义优先排序策略,如: "orderFixed": [ 0, 'asc' ] 该参数说明无论如何排序,永远先进行第一列的正向排序. 对象方式,可以利用关键字pre或post来定义这个规则是优先生效还是置后生效. "orderFixed": { "pre": [ 0, 'asc' ], "post": [ 1, 'asc' ] } |
Array/Object |
无 |
|||
pageLength |
定义初始的页长 |
Number |
10 |
|||
pagingType |
定义翻页组件的样式(有4个选择): simple - 只有上一页和下一页2个按钮 simple_numbers – 上一页,下一页和页码 full – 首页,末页,上一页,下一页4个按钮 full_numbers – 全部按钮和页面 |
String |
simple_numbers |
|||
scrollCollapse |
在设置了一定的scrollY值后起效,为true时,当列表内容不足以撑满scrollY的设定值时,列表高度会自动适应内容. |
Boolean |
false |
|||
search |
定义列表的初始搜索/过滤条件 Search对象可以有以下属性: |
Object |
无 |
|||
search.search |
过滤字符串,注意在默认设置下,所有列的数据都会参与过滤.比如当这个属性为”a”的时候,任何一个列只要包含”a”的行就会被显示.为空表示全部 |
String |
无 |
|||
search.caseInsensitive |
搜索是是否忽略大小写,true为忽略 |
Boolean |
true |
|||
search.regex |
定义搜索字符串是否为一个正则表达式 |
Boolean |
fasle |
|||
search.smart |
禁用获取启用DataTables控件内置的只能过滤算法,这个算法会把搜索字符串进行分割并只能搜索,关闭这个算法仅仅实现简单的字符串查找,false为关闭 |
Boolean |
true |
|||
searchCols |
分别定义每个列的过滤条件.该参数是一个对象数组,每个对象有2个属性: search: 搜索字符串 escapeRegex: 是否是正则表达式 注意不需要设置过滤的列也需要用null占位,比如: "searchCols": [ null, { "search": "My filter" }, null, { "search": "^[0-9]", "escapeRegex": false } ] |
Array |
无 |
|||
stripeClasses |
定义一个字符串数组,在显示行的时候依次使用里面的字符串作为行的class |
Array |
‘odd’ & ‘even’ |
列定义参数(Columns)
参数名 |
说明 |
参考值 |
默认值 |
columns |
列的初始状态的定义,该参数一个是对象数组,每一个对象元素定义一个列.注意,不需定义的列也必须以null占位,比如: "columns": [ { "searchable": false }, null, null ] |
Array |
无 |
columnDefs |
和columns设置非常类似,但可以通过targets属性可以根据灵活的选择需要设定的列.比columns更加灵活.比如: "columnDefs": [ { "targets": 0, "searchable": false } ] targets可以有多种写法: 0或者正整数(可用数组): 表示正向列的索引 负数(可用数组): 表示反向列的索引 字符串: 匹配th的class来选择列. "_all": 所有列,也是默认值. |
||
columns.data |
列的数据名,对应数据里面的属性名 |
String |
无 |
columns.name |
给列设置独立的名称,目前看意义不大 |
String |
无 |
columns.orderable |
设置列是否允许排序 |
Boolean |
true |
columns.searchable |
设置列是否允许过滤 |
Boolean |
true |
columns.type |
通过设置列的类型让控件在排序和过滤这个列是能更好的处理这个列的数据,比如日期,货币等.具体种类很多请参考这里: http://datatables.net/reference/option/columns.type |
String |
无 |
columns.visible |
设置列的可见性,true为显示 |
Boolean |
true |
columns.width |
强行设置列的宽度,支持数字和任何CSS写法,比如20%. |
String |
无 |
columns.render |
非常有用的函数,自定义列的内容.该属性比较常见的用法是函数用法,通过这个函数可以自定义改造列的任何内容,如果要在列中显示比较复杂的内容,这是一个比较好的选择.比如在列中加入功能按钮. 例如: "render": function ( data, type, row, meta ) { return '<a href="'+data+'">Download</a>'; } 4个属性的意思是: data : 当前单元格的数据 type: 当前列的类型 row: 当前行完整的数据对象 meta: 为一个子对象,包含3个属性 row: 当前行的索引 col: 当前列的索引 settings: 当前DataTables控件的setttings对象 |
Function |
无 |
可以看到,DataTables的Options设置还是比较全面和丰富的,当然Options仅仅能在控件初始化的时候对控件进行控制和影响,如果要在控件使用过程中对它进行控制和变化,就需要用到DataTables的函数库(API).
dataTable 参数说明的更多相关文章
- DataTable在内存中的使用
DataTable表示一个与内存有关的数据表,可以使用工具栏里面的控件拖放来创建和使用,也可以在编写程序过程中根据需要独立创建和使用,最常见的情况是作为DataSet的成员使用,在这种情况下就需要用在 ...
- jquery plug-in DataTable API中文文档参考
前言:最近在做一个WEB后台,无意中发现这个插件,试用了一下觉得不错,但网上关于它的资料大多不全,所以利用一些时间将其API文档翻了一下,发在园子里供大家参考.(p.s:个人E文水平很差,对着灵格斯翻 ...
- ASP.NET DataTable的操作大全
DataTable表示一个与内存有关的数据表,可以使用工具栏里面的控件拖放来创建和使用,也可以在编写程序过程中根据需要独立创建和使用,最常见的情况是作为DataSet的成员使用,在这种情况下就需要用在 ...
- datatable 参数详细说明
页面参数说明 var docrTable = $('#docrevisontable').dataTable({ language:lang, //提示信息 autoWidth: false, //禁 ...
- datatable插件使用小记
经验,是前行路上,磕磕碰碰,不断探索,最终留下的结晶:亦是下一次,快速高效,寻求到结果的快捷方式. datatable插件具体可参考: 官网:http://datatables.club/ 参数说明: ...
- Net编程 详解DataTable用法【转】
http://www.diybloghome.com/article/16.html DataTable表示一个与内存有关的数据表,可以使用工具栏里面的控件拖放来创建和使用,也可以在编写程序过程中根据 ...
- bootstrap datatable项目封装
(function($) { $.fn.formJSON = function() { var serializeObj = {}; var array = t ...
- SQL Server游标 C# DataTable.Select() 筛选数据 什么是SQL游标? SQL Server数据类型转换方法 LinQ是什么? SQL Server 分页方法汇总
SQL Server游标 转载自:http://www.cnblogs.com/knowledgesea/p/3699851.html. 什么是游标 结果集,结果集就是select查询之后返回的所 ...
- Javaweb表格加载---DataTable
Datatables是一款jquery表格插件.它是一个高度灵活的工具,可以将任何HTML表格添加高级的交互功能. 使用 jQuery Datatable 构造数据列表,并且增加或者隐藏相应的列,已达 ...
随机推荐
- struts2值栈ValueStack中都有哪些东西?
com.opensymphony.xwork2.dispatcher.HttpServletRequest application com.opensymphony.xwork2.dispatcher ...
- php连接DB2
在php.ini中添加对DB2的支持 //////////////////////////////////////////////////// ;;;;;;;;;;;;;;;;;;;;;; ; Dyn ...
- Java带图片预览功能的图片上传兼容火狐ie
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- SPSS--回归-多元线性回归模型案例解析
多元线性回归,主要是研究一个因变量与多个自变量之间的相关关系,跟一元回归原理差不多,区别在于影响因素(自变量)更多些而已,例如:一元线性回归方程 为: 毫无疑问,多元线性回归方程应该为: 上图中的 x ...
- Yarn上运行spark-1.6.0
目录 目录 1 1. 约定 1 2. 安装Scala 1 2.1. 下载 2 2.2. 安装 2 2.3. 设置环境变量 2 3. 安装Spark 2 3.1. 下载 2 3.2. 安装 2 3.3. ...
- ubuntu16.4中开启vncserver进行远程桌面
使用x11vnc作为vncserver端 1 安装x11vnc $ sudo apt-get update $ sudo apt-get install x11vnc 2 生成密码 $ x11vnc ...
- About DNS
FQDN -- Fully Qualified Domain Name TTL -- Time To Live TLD -- Top Level Domain gTLD -- Generic Top ...
- bootstrap-treeview 关于checkbox选择框不显示的问题
bootstrap-treeview.js 1.0.2 不支持checkbox,最后使用 bootstrap-treeview.js 1.2.0 解决此问题.
- C++ 中的运算符的优先级
C++ 中的运算符的优先级 直接看图
- Linux sort uniq 命令。简单运用
-n #代表以数字方法排序,如果倒序加上-r -t ':' #-t指定分隔符-k ...