jQuery datatables插件

来源:互联网 发布:中国特色社会主义 知乎 编辑:程序博客网 时间:2024/06/04 18:18

最近在做的工作涉及到一部分关于js的东西,好久没有写过js了,一开始还有点不适应,写了一个很简单的表格填充数据的方法,查了好多博客以及官网,并没有找到我想要的结果,比较分散,为了方便大家以后也碰到关于datatables的使用问题,特此记录一下,代码如下:

$('#example').DataTable({   "processing": true,   "serverSide": true,//设置为服务端请求   "searching": false,//隐藏搜索框,使用自定义查询   "iDisplayLength": 10,//设置默认显示页容量   "pagingType": "full_numbers",   "ajax": { "url": "your action url", "contentType": "application/json", "type": "POST",                 "cache":false, "data":function (queryParams) { //这一步是获取前端的查询参数,官网上并没有详细的介绍(我没找到),还有一种方式是用回调,看个人的喜好了。 queryParams.startTime = $('#startTime').val(); queryParams.endTime = $('#endTime').val(); queryParams.start=queryParams.start/queryParams.length+1; queryParams.limit=queryParams.length; return JSON.stringify(queryParams); }, dataFilter: function(data){ //这一步是渲染table,填充数据,网上大部分是用回调,用这种方式的很少,推荐大家用此种方式 var json = jQuery.parseJSON(data); json.recordsTotal = json.total; json.recordsFiltered = json.total; json.data = json.data; return JSON.stringify(json); } }, "columns": [ {"data":"provinceName" },//省/市名称 {"data":"shows" },//曝光 {"data":"clicks" },//点击 {"data":"clickRate" },//点击率 {"data":"requests"},//请求 {"data":"responses"}, //返回 {"data":"revenue" },//收入 {"data":"ecpm"},//ecpm {"data":"cpc"} //cpc ], "columnDefs": [//格式化列 { "render":function ( data){ return data+'%'; }, "targets": 3},{ "render": function ( data){  return formatMoney(data,2) }, "targets": 6 }  ],  "language":  { "lengthMenu": page.lengthMenu, "zeroRecords": page.zeroRecords, "info": page.info, "infoEmpty":"", "sProcessing": page.sProcessing, "paging":false, "oPaginate": { "sFirst": page.sFirst, "sPrevious": page.sPrevious, "sNext": page.sNext, "sLast": page.sLast }, } });


var page ={    lengthMenu:"每天显示 _MENU_ 条",    zeroRecords:"没有符合条件的记录",    info:"当前显示第 _START_ 至 _END_ 条,_TOTAL_ 条记录,共 _PAGES_ 页",    infoEmpty:"没有找到符合条件的结果",    infoFiltered:"从总记录中查询",    sProcessing:'正在努力的加载中...',    sFirst:'首页',    sPrevious:'上一页',    sNext:'下一页',    sLast:'最后一页'}

金额格式化函数


function formatMoney(number, decimal) {    /*     * 参数说明:     * number:要格式化的数字     * decimal:保留小数位数     * */    decimal = decimal > 0 && decimal <= 20 ? decimal : 2;    number = parseFloat((number + "").replace(/[^\d\.-]/g, "")).toFixed(decimal) + "";    var l = number.split(".")[0].split("").reverse();    var r = number.split(".")[1];    var t = "";    for (var i = 0; i < l.length; i++) {        t += l[i] + ((i + 1) % 3 == 0 && (i + 1) != l.length ? "," : "");    }    return t.split("").reverse().join("") + "." + r;}