对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
类型: int

iTotalRecords: 实际的行数

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": "正在加载数据..."}
原创粉丝点击