DataTables处理即将发送的数据

2018-01-18  本文已影响0人  answer6

有时候我们想要把datatables发送到服务器的数据进行一遍自己的过滤,重新整合发送数据。


这里用到了DT的preXhr方法 大概的实现方法

var table = jQuery('#table_id_info')
                .on('preXhr.dt',function( e, setting, data ){
                    // 在这里就可以对发送的数据进行重写
                    // console.log( e )
                    // console.log( setting )
                    // console.log( data )
                    // console.dir( data.order[0].column )
                })
                .DataTable({
                    dom:"Bfrtip",           // 隐藏掉自己的搜索框
                    buttons: [
                        'copy', 'excel', 'pdf','print'
                    ],
                    order: [[ 8, "desc" ]],
                    serverSide:true,  // 这里关闭的话 上面的console.log 就会出现 undefined
                    processing:true,
                    language: {
                        url: 'yoururl'
                    },

                    ajax: {
                        type:'GET',
                        url: "your.url",
                        // dataSrc:'data',
                        data: {

                        },
                        // success:function(res){
                        //     console.log(res);
                        // }
                    },
                    // 这里为表格绑定数据
                    "columns": [
                        { data : 'id'},
                        { data : 'employee_display_name'},
                        { data : 'employee_wx_headimg',
                            render:function( data, type, full, meta ){
                            return '<img class="wxhead" width="30px" src="' +
                            data + '"><span>' +full.employee_wx_nickname+ '</span>';
                            }
                        },
                        { data : 'employee_realname'},
                        { data : 'employee_store_name'},
                        { data : 'customer_wx_headimg',
                            render:function( data, type, full, meta ){
                            return '<img class="wxhead" width="30px" src="' +
                            data + '"><span>' +full.customer_wx_nickname+ '</span>';
                            }   
                        },
                        { data : 'reward'},
                        { data : 'checkout_status',
                            render: function(data,type){
                                        if(data == 0){
                                            return '未结算';
                                        }else{
                                            return '已结算';
                                        }
                                    }
                        },
                        { data : 'create_date'}
                    ]
                });


处理的数据重写如上图
上一篇下一篇

猜你喜欢

热点阅读