首页 > 代码库 > JQuery中DataTables强大的表格解决方案
JQuery中DataTables强大的表格解决方案
(1)DataTables的默认配置
$(function(){
$("#workbench_topicTable").dataTable();
})
(2)DataTables的基础配置
$("#workbench_topicTable").DataTable({
bPaginate: true, //翻页功能
bLengthChange: true, //改变每页显示数据数量
bFilter: true, //过滤功能
bSort: false, //排序功能
bInfo: true,//页脚信息
bAutoWidth: true//自动宽度
bProcessing : true,//指定当正在处理数据的时候,是否显示“正在处理”这个提示信息
bServerSide : true,//是否从服务端获取数据
aLengthMenu : [ 10, 20, 40, 60 ], // 动态指定分页后每页显示的记录数。
searching : false,// 禁用搜索
lengthChange : true, // 是否启用改变每页显示多少条数据的控件
deferRender : true,// 延迟渲染
stateSave: true,//开启状态记录,datatabls会记录当前在第几页,可显示的列等datables参数信息
iDisplayLength : 20, // 默认每页显示多少条记录
iDisplayStart : 0,
ordering : false,// 全局禁用排序
autoWidth: true,
scrollX: false,
scrollY :false,
scrollY : false,
colReorder: true,//列位置的拖动
destroy : true, //Cannot reinitialise DataTable,解决重新加载表格内容问题
language :{
{
sProcessing: "处理中...",
sLengthMenu: "显示 _MENU_ 项结果",
sZeroRecords: "没有匹配结果",
sInfo: "显示第 _START_ 至 _END_ 项结果,共 _TOTAL_ 项",
sInfoEmpty: "显示第 0 至 0 项结果,共 0 项",
sInfoFiltered: "(由 _MAX_ 项结果过滤)",
sInfoPostFix: "",
sSearch: "搜索:",
sUrl: "",
sEmptyTable: "表中数据为空",
sLoadingRecords: "载入中...",
sInfoThousands: ",",
oPaginate: {
sFirst: "首页",
sPrevious: "上页",
sNext: "下页",
sLast: "末页"
},
oAria: {
sSortAscending: ": 以升序排列此列",
sSortDescending: ": 以降序排列此列"
}
}
}
})
JQuery中DataTables强大的表格解决方案
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。