$(function(){
var n=0;
var urlData="../data/test.txt";
var tables;
function creatDataTables(isSearch,dataJson){
tables=$("#example2").DataTable({
lengthChange:true,//是否允许改变每页显示数据数量
serverSide:true,//开启服务器,数据由服务器处理
processing:true,//载入数据的时候是否显示 “载入中” 提示
pageLength:6, //每页加载的数据条数
ordering:false,//是否开启排序 (排序操作在服务端进行,所有可以关了)
pagingType:"simple_numbers",//分页按钮的显示方式
autoWidth:true,//控制表格是否自适应宽度
stateSave:false,
searching:true,//禁止datatables本地搜索
paging:false,
language:{
loadingRecords:"数据载入中...",
emptyTable:"表中数据为空",
info:"显示第 _START_ 至 _END_ 项结果,共 _TOTAL_ 项",
infoEmpty:"无数据",
infoFiltered:"由 _MAX_ 项过滤得到",
infoPostFix:"",
infoThousands:",",
lengthMenu:"显示 _MENU_ 项结果",
search:"搜索:",
zeroRecords:"没有匹配结果",
paging:{
"first": "首页",
"previous": "上页",
"next": "下页",
"last": "末页"
},
paginate:{
"previous": "上一页",
"next": "下一页",
"last": "尾页",
"first": "首页"
},
},
"dom": "<'row'<'col-xs-2'l><'#mytool.col-xs-4'><'col-xs-6'f>r>" +
"t" +
"<'row'<'col-xs-6'i><'col-xs-6'p>>",
initComplete:function(){
$("#mytool").append('<button id="datainit" type="button" class="btn btn-primary btn-sm">增加基础数据</button> ');
$("#mytool").append('<button type="button" class="btn btn-default btn-sm" data-toggle="modal" data-target="#myModal">添加</button>');
},
footerCallback:function(tfoot,data,start,end,display){
console.log(data);
//$(tables.columns(4).footer()).html(
// tables.columns(4).data().reduce(function(a,b){
// console.log(typeof a);
// return parseInt(a)+parseInt(b);
// })
//);
},
ajax:{
url:urlData,
contentType:"application/json",
type:"POST",
data:function(d){ //提交额外的参数或者修改参数
var x=JSON.stringify(d);
return x;
},
//dataSrc:function(data){
// console.log(data);
//}
},
drawCallback:function(settings){
alert('表格重绘了');
},
rowCallback:function(row,data){//打印出来N个data N为数据个数
//data为所有数据,row为每行的html
console.dir(data);
//if(data.age == "10000"){
// $(row).addClass('active').find("input").attr("checked",true);
//}else{
// $(row).removeClass('active').find("input").attr("checked",false);
//}
},
lengthMenu:[//一维或者二维数组 这个例子为二维数组,第一组为具体值,第二组是对第一组的描述文字并用来展示
[2,5,-1],
[2,5,"所有"]
],
columns:[
{
"data":"name",
"render":function(data,type,full,meta){
n=n+1;
console.log(n);
return '<input type="checkbox" class="checkboxes" value="'+data+'"/>';
},
"width":"13px"
},{
"data":"name"
},{
"data":"age"
},{
"data":"height"
},{
"data":"weight"
},{
"data":null,
"width":"60px",
"defaultContent":"<div class='btn-group'>"+
"<button id='editRow' class='btn btn-primary btn-sm' type='button'><i class='fa fa-edit'></i></button>"+
"<button id='delRow' class='btn btn-primary btn-sm' type='button'><i class='fa fa-trash-o'></i></button>"+
"</div>"
}
],
columnDefs:[
{
targets:[0,-1],
orderable:false,
searchable:false
}
]
});
}
creatDataTables();
});
一共只有10个数据,但是 columns中的 render里面 可以console.log 两遍数据 也就是log出了20个数据
我看了一下执行顺序 先执行了columns 然后依次执行了rowCallback footerCallback drawCallback 最后又执行了一次columns
这是怎么回事 ,求大神解释
4 个解决方案
#1
随便来个人回复一下 我送分了 100分
#2
我来拿100分的,呵呵
#3
哥,我来晚了
,百度资料能不能给个链接
#4
楼主这个问题解决了吗?我也遇到了,很棘手,求指导
#1
随便来个人回复一下 我送分了 100分
#2
我来拿100分的,呵呵
#3
哥,我来晚了
,百度资料能不能给个链接
#4
楼主这个问题解决了吗?我也遇到了,很棘手,求指导