如何按日期列过滤jquery数据表？

Question

我有一个数据表，我试图根据一列中的日期进行过滤。我想过滤基于具有一年或更长日期的lastModified列的数据，但即使在某些硬编码日期过滤它也是一个好的开始。数据以字符串格式存储，所以我尝试使用新的Date（）函数转换为日期。

var table = $('#database').DataTable({ 
     fixedHeader: true, 

     data: dataSet, 
     columns: [ 
     { data: "processName" }, 
     { data: "processLob" }, 
     { data: "processOwner"}, 
     { data: "RiskReviewer"}, 
     { data: "lastModified"}] 
     }); 

     var filteredData = table 
     .column({ data: "lastModified"}) 
     .data() 
     .filter(function (value, index) { 
     return new Date(value) < 2015-10-10 ? true : false; 
     }); 

Answer 1

您要做的第一件事就是为您的日期列添加“columnDefs”对象并将其类型指定为“date”。只要您遵循一个众所周知的格式，DateTables就内置了日期解析。 ColumnType API Def

如果这样不能完全实现，那么您将需要为刚刚创建的新columnDef对象的数据列定义渲染函数。在那里你可以检查渲染类型并为显示和原始数据值（最好是Date类型的值）返回一个“好”的值来表示其他所有内容。 Render API Defintion

另外一些一般建议不要试图打击图书馆。它实际上非常灵活，可以处理很多事情。因此，尽可能使用内置的API函数。当人们尝试使用JQuery手动操作表时，通常情况会出错。在封面之下，DataTables插件保持了大量的状态，从不会传递给DOM。基本上，如果在它的API中有一个函数，就使用它。

编辑：添加对原始海报问题的答案，即使他找到了另一种解决方案。

有一点要记住的是，“过滤器”只是为了让你回到过滤数据集。它不会改变网格中的显示。相反，您会希望在“column（）”API项目上使用“搜索”来筛选DataTable中显示的行。

但是有一个小问题。搜索方法只接受常规值而不是函数。所以，如果你想实现这一点，你必须提供自定义搜索功能，像这样：

// The $.fn.dataTable.ext.search array is shared amongst all DataTables and 
// all columns and search filters are evaluated in the order in which they 
// appear in 
// the array until a boolean value is returned. 
$.fn.dataTable.ext.search.unshift(function(settings, data, dataIndex) { 
    // Using a negative value to get the column wraps around to the end of 
    // the columns so "-1" will always be your last column. 
    var dateColumn = $(this).column(-1); 

    // We get the data index of the dateColumn and compare it to the index 
    // for the column currently being searched. 
    if(dateColumn.index() !== dataIndex) {' 
     // Pretty sure this indicates to skip this search filter 
     return null; 
    } 

    var columnSearchingBy = $(this).column(dataIndex); 

    // Allows the data to be a string, milliseconds, UTC string format ..etc 
    var columnCellData = new Date(data.lastModified); 
    var valueToSearchBy = new Date(columnSearchingBy.search.value); 

    // Ok this is one of the worst named methods in all of javascript. 
    // Doesn't actually return a meaningful time. Instead it returns the a 
    // numeric value for the number of milliseconds since ~ 1970 I think. 
    // 
    // Kind of like "ticks()" does in other languages except ticks are 
    // measured differently. The search filter I am applying here is to 
    // only show dates in the DataTable that have a lastModified after or 
    // equal the column search. 
    return (valueToSearchBy.getTime() >= columnCellData.getTime()); 
}); 


// So this should use our fancy new search function applied to our datetime 
// column. This will filter the displayed values in the DataTable and from 
// that just a small filter on the table to get all the data for the rows 
// that satisfy the search filter. 
var filteredData = table 
     .column({ data: "lastModified"}) 
     .search('2015-10-10') 
     .draw(); 

即使你找到了另一种方式去在这一个也许上面会帮助你以后。