datatable的部分问题处理(动态定义列头,给某行添加事件,初始显示空数据)

在ajax中,用datatable再去重新配置列头,当然传回的数据中,要有对应放列头的键值对

自定义了Mock数据,用于前端自己交互。

其中,rowdata用于存放传回的数据,col_define用于存放定义的列头,targets表示第几列,title表示列名,data是为了对应data下的rowdata数据

"/salary_import"200'code': 'ok''Msg': '小垃圾''data''rowdata''名字': '呆头鹅''身份证': 123456789451'exist': 0'基本工资': 1000'职位工资': 100'绩效工资': 10'应扣工资': 2000'名字': '小学鸡''身份证': 12123214124'基本工资': 2000'职位工资': 300'绩效工资': 30'应扣工资': 3000'名字': '奔比''应扣工资': 2000'col_define''targets': 0'data': '名字''title': '名字''targets': 1'data': '身份证''title': '身份证''targets': 2'data': '基本工资''title': '基本工资''targets': 3'data': '职位工资''title': '职位工资''targets': 4'data': '绩效工资''title': '绩效工资''targets': 5'data': '应扣工资''title': '应扣工资'

那么你ajax交互的时候,就可以

'/salary_import''POST''json' ('ok' === res['code''解析完成!''返回数据 是',res['data' excel = $('#salary_excel_table''language'"dom": 'lB<"top"f><"toolbar">rt<"bottom"ip><"clear">'"paging": "lengthChange": "info": 'destroy': "deferRender": });

不知道是否是插件之间兼容性问题,反正,如果我直接先在外面初始化了datatable,给opts先赋了初始配置值,然后再在ajax下,通过改变对应变量再赋值回datatable下的配置文件,即

  var excel = $('#salary_excel_table').DataTable(opts);百度上都是这样教的,可能单单是我的问题吧,只能重新写份自定义配置,会保险很多,这里就是动态定义列头了,通过后台给的数据,直接描绘前端的列头添加事件
var person=$('#person_table').Datatable(..........);//里面的配置自己去配置你们想要后台给你们的data,格式就不教了{ table_data =person.row( department= id= name='/point''POST' m = $('#money_table''data']['data_money''德玛西亚'});

 {    var currentPage = table.page();    table.clear();    table.rows.add(dataList);    table.page(currentPage).draw(false);};

点击Datatable下某行,就能够获取到该行数据,放好id,姓名和部门,然后用ajax将这三个数据发给后台,让后台返回给你需要的数据,去渲染另一个datatable(这里你随便怎样都可以,也可以做跳转啥的),重要的是前后端那些数据格式要对好,不然都会出现列数据对不到的错误,还有就是这个reloadData很重要!

显示空数据

这个就更简单了,你一开始配置表格的时候嘛,可以不写ajax,但是写好列行数据格式,反正没人传给你的会,就是空,等你点击什么或者导入什么的时候,success了再ajax到对应的表的行数据就行了

显示没有数据,但是列头还是存在的,所以下面没有ajax)

money_table = $('#money_table''language'"order"0,"desc""columnDefs""title": "应发""targets": 0"title": "应扣""targets": 1"title": "实发""targets": 2"title": "个税""targets": 3"title": "年月""targets": 4"title": "功能""targets": 5"render": Meta) { '''columns''data':'yf''data':'yk''data':'sf''data':'gs''data':'yy-mm''data':'destroy':"deferRender":
 

相关文章

页面搜索关键词突出 // 页面搜索关键词突出 $(function () {...
jQuery实时显示日期、时间 html: &lt;span id=&quot...
jQuery 添加水印 &lt;script src=&quot;../../../.....
中文:Sys.WebForms.PageRequestManagerParserErrorExceptio...
1. 用Response.Write方法 代码如下: Response.Write(&q...
Jquery实现按钮点击遮罩加载,处理完后恢复 思路: 1.点击按...