datatables的自定义传参

自定义搜索:其实也就是可以把自己需要搜索的值传到服务器,服务器做对应处理,也就是自定义传参

给两个自定义的实例


  1. preXhr
 var tables_comments = jQuery('#table_comments_log').DataTable({});
  tables_comments
                        .on('preXhr.dt', function ( e, settings, data ) {
                            // 额外传参
                            data.ctime = jQuery('#start-date1').val();
                            data.etime = jQuery('#end-date1').val();
                        })

  1. ajax的传参


    datatables的自定义传参_第1张图片
    自定义传参demo

题外话

一个页面多个搜索 要用到 jQuery.fn.dataTable.ext.search.pop();
e.g.

使用场景

  // 这个是多过滤
                jQuery('#start-date1,#end-date1').change(function() {
                    tables_comments
                        .on('preXhr.dt', function ( e, settings, data ) {
                            data.ctime = jQuery('#start-date1').val();
                            data.etime = jQuery('#end-date1').val();
                        })
                    jQuery.fn.dataTable.ext.search.push(
                        function( settings, data, XdataIndex ) {
                        // console.log( data )
                            var start          = new Date( jQuery("#start-date1").val().replace(/-/g,"/") ).setHours(0,0,0,0); // 15000000000000000
                            var end            = new Date( jQuery("#end-date1").val().replace(/-/g,"/") ).setHours(0,0,0,0);   // 1500000000000000
                            var ymd_date       = data[10];
                            var ymd            = ymd_date.replace(/-/g,"/").substr(0,10);
                            var search         = new Date( ymd );
                            if ( ( isNaN (start) && isNaN (end) ) ||
                                (isNaN(start) && search <= end) ||
                                (search>= start && isNaN(end) ) ||
                                (start <= search && search <= end )
                            ){
                                return true;
                            }else{
                                return false;
                            }
                        }
                    );
                    tables_comments
                    .draw();//按时间段筛选完重绘表格
                    jQuery.fn.dataTable.ext.search.pop();
                })

你可能感兴趣的:(datatables的自定义传参)