DataTable案例
程序员文章站
2022-07-16 17:18:38
...
DataTable的全局设置 $.extend( $.fn.dataTable.defaults, { searching: false, ordering: false, paging: false, info: false, autoWidth: false, select: true //默认是不支持单击事件的,需要用到dataTables.select.js插件,然后设置select } ); var descTable = tableconfig.tc_destColumns.DataTable({ scrollY: $(".portlet-body").height(), // 隐藏表标题 "fnDrawCallback": function ( oSettings ) { $(oSettings.nTHead).hide(); }, aoColumns: [{ mData: "title", sWidth: '100%' }] }); // 点击行事件 descTable.on( 'select', function ( e, dt, type, indexes ) { if ( type === 'row' ) { var row = descTable.row( indexes ).data(); if (row == null || row == undefined) { return; } var body = getBody(target, row.id); if (body != null) { configColumnsChange(target, body) } } } ); //表格初始化之后,需要手动为表格添加数据 var destTable = tableconfig.tc_destColumns.DataTable(); destTable.rows.add(hideBodys).draw(); // 数据初始化之后默认选择第一行 destTable.row(':eq(0)').select(); // 对表格中的某一列手动设置数据 configTable.rows().every( function () { var data = this.data(); data.value = body.showInfo[data.tag]; tableconfig.tc_configGrid.dataTable().fnUpdate(data, this.index()); });