首页 > 解决方案 > 在数据表问题中按日期范围过滤

问题描述

我正在数据表中实现日期范围过滤器,当以 YYYY-MM-DD 格式显示列日期时,过滤器工作得很好,但我需要以 DD-MM-YYYY 格式显示列,所以我应用了 moment 。

在数据表中使用时刻的回调函数:

{ targets : [8], 

render : function (data, type, row) {
   return  moment(data).format('DD/MM/YYYY')
}
},

结果,我看到第二天显示在列上。下图。我想按日期过滤,列按以下格式排序 DD/MM/YYYY

搜索日期选择器 显然我在 datepicker 过滤器中选择了第 10 天,它在表格上显示第 11 天。

    $(document).ready(function(){

    $.fn.dataTable.ext.search.push(
        function (settings, data, dataIndex) {
            var fecha_inicio = $('#fecha_inicio').datepicker("getDate");
            // alert(fecha_inicio);
            var fecha_fin = $('#fecha_fin').datepicker("getDate");
             var arr =  data[8].split('/').reverse().join('-');
             // alert(arr);
             // var temp = arr[0] +'-'+ arr[1] +'-'+arr[2]; 

             var startDate = new Date(arr);
             startDate.setHours(0,0,0,0);
              // alert(startDate);


            if (fecha_inicio == null && fecha_fin == null)      { return true;}
            if (fecha_inicio == null && startDate <= fecha_fin) { return true;}
            if(fecha_fin == null && startDate >= fecha_inicio)  { return true;}
            if (startDate <= fecha_fin && startDate >= fecha_inicio) { return true;}
            return false;
        }
    );

按日期范围正确过滤

如果我取出回调代码,则列显示正确,日期格式除外。

提前致谢。

标签: javascriptdatatablesmomentjs

解决方案


也许你想使用type参数,例如

render:function(data,type,row,meta){
    if(type=='display'){
        return moment(data).format('DD/MM/YYYY');
    }
    if(type=='filter'){
        //there is an example, show how to work, you can use whatever you want time format
        return moment(data).format('YYYY/MM/DD');
    }
     if(type=='sort'){
        //maybe there is timestamp format 
        return data;
    }
    return data;
}

有关更多详细信息,请查看https://datatables.net/reference/option/columns.render function render( data, type, row, meta )的一部分


推荐阅读