使用的angular框架,项目比较老,所以版本比较早,为 v1.2.16,绑定数据使用的是datatables来进行数据绑定,版本为V1.10.5 ,在绑定数据的时候遇到了一个问题,目前还没有找到处理的方法,此处为记录一下。
datatables绑定了一组数据,可以对点击行中的查看,查看详细的数据,目前的问题是在新增了分页之后,点击查看事件会被执行多次,我的理解是点击分页后会对表格进行再次渲染,然后渲染几次,事件就会被执行几次,造成的后果会导致详细数据无法正常显示。
代码如下:
function BindData(data) {
taskDataTable = $("#divShowInfo").dataTable({
“bDestroy”: true,
“oLanguage”: { “sUrl”: “…/…/Scripts/assets/plugins/data-tables/en.txt” },
“bSort”: false,
“bStateSave”: false,
“bPaginate”: true,
“bFilter”: false,
“iDisplayLength”: 5,
“sPaginationType”: “bootstrap_full_number”,
“bProcessing”: true,
“bServerSide”: false,
“aaData”: data,
“aLengthMenu”: [[5, 10, 20, 50, 100], [5, 10, 20, 50, 100]],
“aoColumns”: [
{
“mDataProp”: “id”,
“sTitle”: “编号”,
“mRender”: function (val, type, obj) {
return (val == null ? “” : val);
}
},
{
“mDataProp”: “name”,
“sTitle”: “姓名”,
“mRender”: function (val, type, obj) {
return (val == null ? “” : val);
}
},
{
“mDataProp”: “id”,
“sTitle”: “查看详细”,
“mRender”: function (val, type, obj) {
var shtml = ‘<a class=“btn btn-xs” title=“查看” style=“background-color:rgb(191,134,49);color:white;”ng-click=“viewChatMessages(’’ + val + ‘’)”>’;
return shtml;
}
}
],
“initComplete”: function (settings, json) {
$(‘div.dataTables_processing’).remove();
},
“fnRowCallback”: function (nRow, aData, iDisplayIndex) {
c o m p i l e ( n R o w ) ( compile(nRow)( compile(nRow)(scope);
},
});
}
在多次点击“上一页”、“下一页”、选中分页页码进行调整后,viewChatMessages()事件点击一次会执行多次,如不进行分页,则执行正常。始终找不到解决的办法,最后就只能在viewChatMessages()事件中进行判断,如第二次执行这返回false。