dataTable使用总结(包含序号生成,悬浮框使用等)

来源:互联网 发布:最新三级数据库 编辑:程序博客网 时间:2024/06/06 06:46

//序号的生成

"fnDrawCallback"    : function(){

this.api().column(1).nodes().each(function(cell,i){
cell.innerHTML = i+1;
});

},


"aoColumns": [{  
 "data" : null,  
        "title" : "序号",  
           "defaultContent" : "", 
"width": "4%",
          "class" : "text-center"  

  }, {  


//悬浮框的使用

1.第一步在js引入方法,写在所需限制字段的class后面,效果当超出部分将已“...”代替,鼠标放上面时触发悬浮框效果

"render": function(data, type, row, meta) {

if (data) {
data = data.substring(0, data.length - 1);
var showdata = data;
if (data.length > 4) {
showdata = data.substring(0, 4) + "..";
}
return '<div class="" data-toggle="tooltip"  title="' + data + '">' + showdata + '</div>';
} else {
return '--';
}


}

(在公共js中写悬浮框的使用方法,方便以后调用,相关代码可以查看本人博客jqueryUtil.js)


//判定状态类型选择是否出现功能按钮

 

},   {        "title" :  "操作",
        "defaultContent" :  "",
        "class" :  "text-center",
"width": "12%",
"createdCell": function(nTd, sData, oData, iRow, iCol) {
var regBatchId = oData.regBatchId;
var certificateId = oData.certificateId;
if (oData.status == '0') {
var content = '<button class="btn btn-xs blue" onclick="showPreRegVerifyBackTracking(\'' + regBatchId + '\')"> 补录 </button>';
content += '<button class="btn btn-xs red" onclick="showPreRegVerifyVoidModal(\'' + regBatchId + '\')"> 作废 </button>';
} else if (oData.status == '1') {
var content = '<button class="btn btn-xs blue" onclick="showPreRegVerifyCheck(\'' + regBatchId + '\',\'' + certificateId + '\')"> 查看 </button>';
} else {
var content = '<button class="btn btn-xs blue" onclick="showPreRegVerifyBackTracking(\'' + regBatchId + '\')"> 补录 </button>';
}
$(nTd).html(content);
}
}],


//根据拿取到的数值0或1,在页面上输出对应的状态中文

},   {                 "data" :  "status",
            "title" :  "状态",
        "defaultContent" :  "",
 "width": "14%",
         "class" :  "text-center",
"fnCreatedCell": function(nTd, sData, oData, iRow, iCol) {
var status = oData.status;
var content = "";
if ("0" == status) {
content = "待补录";
} else if ("1" == status) {
content = "初审通过";
} else {
content = "已作废";
}
$(nTd).html(content);
}


原创粉丝点击