对datatable对象参数进行部分配置以及说明
来源:互联网 发布:旅游网络推广方案 编辑:程序博客网 时间:2024/05/17 23:02
转自:http://blog.csdn.net/u013405778/article/details/51690038
http://blog.csdn.net/yibing548/article/details/45078123
详细参数
https://www.cnblogs.com/fuqiang88/p/4731526.html
注意:
1.返回的数据格式一定是json。例如: 数据是以aaData开头的。否则对不上
{ "aaData": [ { "isDelete": 0, "typeName": "住院信息", "updateUserId": 2, "createTime": "Nov 21, 2017 12:00:00 AM", "modelName": "客户", "updateTime": "Nov 21, 2017 12:00:00 AM", "modelClass": "crm", "orderIndex": 1, "no": 1, "createUserId": 2 }, { "isDelete": 0, "typeName": "门诊信息", "updateUserId": 2, "createTime": "Nov 21, 2017 12:00:00 AM", "modelName": "客户", "updateTime": "Nov 21, 2017 12:00:00 AM", "modelClass": "crm", "orderIndex": 2, "no": 2, "createUserId": 2 } ]}
重要参数
iDisplayStart :当开启分页的时候,定义展示的记录的起始序号,不是页数,因此如果你每个分页有10条记录而且想从第三页开始,需要把该参数指定为20
默认值 0
类型: intiTotalRecords: 实际的行数
iTotalDisplayRecords: 过滤之后,实际的行数。
fnRender的参数是每行的数据,取的时候一定要oObj.aData得到数据。
"aoColumnDefs":[{ "aTargets" : [0], "fnRender" : function(oObj) { return '<input name="chk" value="' + oObj.aData.id + '" type="checkbox" />'; } },{ "aTargets" : [6], "fnRender" : function(oObj) { if(oObj.aData.isDelete==0){ return '否'; }else{ return '是'; } } },{ "aTargets" : [7], "fnRender" : function(oObj) { //alert(JSON.stringify(oObj.aData)) var time=oObj.aData.createTime; if(time!='--'){ time=new Date(time); return time.toLocaleString(); }else{ return '--'; } } },{ "aTargets" : [9], "fnRender" : function(oObj) { var time=oObj.aData.updateTime; if(time!='--'){ time=new Date(time); time=new Date(time); return time.toLocaleString(); }else{ return '--'; } } },{ "aTargets" : [11], "fnRender" : function(oObj) { alert(JSON.stringify(oObj.aData.id)) return "<a href='"+basePath+"model/updateModelById.action'>修改</a>"; } } ]
向服务端传递参数
'fnServerParams' : function(aoData) { aoData.push({ "name" : "phone", "value" : phone }); },
$('#example').dataTable({ //paging:false; //设置paging选项,禁止表格分页(默认是打开的) //scrollY: 100; //在表格里使用滚动,你需要加上scrollY选项 //"sScrollY" : 450, //DataTables的高 //"sScrollX" : 820, //DataTables的宽 //"aaSorting" : [[2, "desc"]] "sPaginationType": "full_numbers", //分页风格,full_number会把所有页码显示出来 bFilter: true, //去掉搜索框 //对于从服务器端取数据,要指定以下两个参数bServerSide和sAjaxSource "bServerSide": true, //开启服务器模式,原始的静态页面不分页 //使用ajax源 "sAjaxSource": "ajax_data.php", /* 从 Ajax 源加载数据的表的内容 如果加"type": "POST",则使用post方式传递数据*/ //aoData是以post方式传递给php交互的key-value "fnServerData": function ( sSource, aoData, fnCallback ) { $.ajax( { "dataType": 'json', "type": "POST", "url": sSource, "data": aoData, "success": fnCallback } ); }, "iDisplayLength": 5, //设置datatables的默认显示条数 //定义每页显示数据数量数组 "aLengthMenu": [ [5,10, 20, 30, 40, -1], [5,10, 20, 30, 40, "全部"] //每页变化值 ,默认显示最后一个元组 ], // 改变语言提示 把原始表示转换为中文 "oLanguage": { "sLengthMenu": "每页 _MENU_ 条记录", "sZeroRecords": "抱歉,没有找到", "sInfo": "从 _START_ 到 _END_ / 共 _TOTAL_ 条数据", "sInfoEmpty": "没有数据", "sInfoFiltered": "(从 _MAX_ 条数据中检索)", "sSearch":"搜索:", "oPaginate": { "sFirst": "首页", "sPrevious": "上一页", "sNext": "下一页", "sLast": "尾页" }, "sProcessing": "<img src='loading.gif' />", }, });
工作中用的参数
$('#modelTable').dataTable({ "bProcessing" : true, 'bServerSide' : true, 'fnServerParams' : function(aoData) { aoData.push({ name : "modelItemVo.modelId", value : modelId },{ name : "modelItemVo.modelClass", value : modelClass }); }, "sAjaxSource" : basePath + "model/getModelItemList.action", "sServerMethod" : "POST", "sPaginationType" : "full_numbers", "bPaginate" : true, // 翻页功能 "bStateSave" : true, // 状态保存 "bLengthChange" : false, // 改变每页显示数据数量 "bFilter" : false, // 过滤功能 "bSort" : false, // 排序功能 "bInfo" : true,// 页脚信息 "bAutoWidth" : false,// 自动宽度 "bDestroy" : true, "iDisplayLength" : 15, // 每页显示多少行 "aoColumns" : [{ "sTitle" : "<input type='checkbox' id='total' onclick='selectAll(this)'/>", "mDataProp" : null, "sClass" : "chk" }, { "sTitle" : '序号', "mDataProp" : "no", "sWidth" : "20", "sClass" : "num" }, { "sTitle" : '字段', "mDataProp" : "filed", "sWidth" : "60", "sClass" : "tdCenter" }, { "sTitle" : '数据类型', "mDataProp" : "dataType", "sWidth" : "40", "sClass" : "tdCenter" }, { "sTitle" : '名称', "mDataProp" : "itemLabel", "sWidth" : "80", "sClass" : "tdCenter" }, { "sTitle" : '排序', "mDataProp" : "orderIndex", "sWidth" : "20", "sClass" : "tdCenter" }, { "sTitle" : '是否删除', "mDataProp" : "isDelete", "sWidth" : "20", "sClass" : "tdCenter" }, { "sTitle" : '独占一行', "mDataProp" : "isSingle", "sWidth" : "20", "sClass" : "tdCenter" }, { "sTitle" : '是否显示', "mDataProp" : "isShow", "sWidth" : "20", "sClass" : "tdCenter" }, { "sTitle" : '操作', "mDataProp" : null, "sWidth" : "40", "sClass" : "tdCenter" }], "oLanguage" : { "sUrl" : basePath + "plugins/datatable/cn.txt" // 中文包 }, "fnInitComplete":function(){ // 重置iframe高度 window.parent.frameResize(); }, "aoColumnDefs":[{ "aTargets" : [0], "fnRender" : function(oObj) { return '<input name="chk" value="' + oObj.aData.id + '" type="checkbox" />'; } },{ "aTargets" : [3], "fnRender" : function(oObj) { if(oObj.aData.dataType==1){ return '字符串文本'; }else if(oObj.aData.dataType==2){ return '文本区'; }else if(oObj.aData.dataType==3){ return '日期'; }else if(oObj.aData.dataType==4){ return '下拉列表'; }else if(oObj.aData.dataType==5){ return '复选框'; }else{ return "单选框"; } } },{ "aTargets" : [6], "fnRender" : function(oObj) { if(oObj.aData.isDelete==0){ return '否'; }else{ return '是'; } } },{ "aTargets" : [7], "fnRender" : function(oObj) { if(oObj.aData.isSingle==0){ return '否'; }else{ return '是'; } } },{ "aTargets" : [8], "fnRender" : function(oObj) { if(oObj.aData.isShow==0){ return '显示'; }else{ return '不显示'; } } },{ "aTargets" : [9], "fnRender" : function(oObj) { return "<a href='"+basePath+"model/findModelItemById.action?id="+oObj.aData.id+"'>修改</a>"; } } ] });
cn.txt
{"sLengthMenu": "每页显示 _MENU_ 条记录","sZeroRecords": "抱歉, 没有找到","sInfo": "共 _TOTAL_ 条数据 ","sInfoEmpty": "","sInfoFiltered": "(从 _MAX_ 条数据中检索)","oPaginate": { "sFirst": "首页", "sPrevious": "上一页", "sNext": "下一页", "sLast": "尾页" }, "sZeroRecords": "暂无数据!", "sProcessing": "正在加载数据..."}
阅读全文
0 0
- 对datatable对象参数进行部分配置以及说明
- 手工参数化,对datatable进行操作
- dataTable 参数说明
- dataTable 参数说明
- datatable参数和服务端ajax函数配置及说明
- VB.net 使用LINQ对datatable对象进行查询
- 对DataTable进行分页
- 对DataTable进行分页
- 对DataTable进行分页
- 对datatable进行排序
- 对DataTable进行Distinct
- 对DataTable进行分页
- DataTable的Select方法的filterExpression参数以及DataTable的Column的Expression的说明
- datatable参数以及应用
- Xdebug安装配置以及个参数说明
- nginx具体的配置以及参数说明
- 创建DataTable以及部分操作
- 转载proguard原理以及部分命令参数说明
- myeclipse中的快捷键列表
- 2017-11-28 7周2次课 linux系统日常管理(二)
- java中NULL与""的区别
- SpringBoot非官方教程 | 第十篇: 用spring Restdocs创建API文档
- JAVA List<Map>结果集处理方法集合
- 对datatable对象参数进行部分配置以及说明
- Voxel Space:不到20行代码实现地形渲染
- 【Scikit-Learn 中文文档】神经网络模块(监督的)- 监督学习
- 已知一个GeoTiff,得到其边界矢量的方法
- Problem J 小鑫need help
- 从高性能计算(HPC)技术演变解析方案、生态和行业发展趋势
- (二)大型互联网分布式企业微服务云架构
- C# 获取某月的第一天和最后一天
- SAP 全球产品营销总监:产品营销驱动 B2B 企业爆发式增长的 6 大要点