javascript - 使用DatePicker过滤DataTable

标签 javascript jquery datatable datepicker

我的页面中有一个名为“search_table”的数据表。我在表中有一个额外的标题行,它具有不同的过滤器选项(下拉列表、文本、日期选择器)。对于日期列,我有两个日期选择器,一个用于最小,一个用于最大。我可以根据日期选择器过滤数据表的数据,但有一个问题:

当我选择一个日期时,表格中的所有行都会消失,我必须单击其中一个标题(如对数据进行排序)才能显示数据。一旦我这样做,就会显示正确的数据(日期在最小和最大之间)。

我使用什么功能来强制数据选择器重新绘制表格?在我的就绪函数中,我有以下代码:

      $(document).ready(function() {
      var table = $('#search_table').DataTable();
      $(".datepicker").datepicker( {
          maxDate:0,
          changeMonth: true,
          changeYear: true,
          dateFormat: 'yy-mm-dd',
          onClose: function(selectedDate) {
              table.draw();}});
      $('#min_create, #max_create, #min_update, #max_update').keyup(function() { table.draw(); });
      $('#min_create, #max_create, #min_update, #max_update').click( function() { table.draw(); });
      $('#min_create').datepicker().bind('onClose', function(){ table.draw(); });
  });

min_create、max_create、min_update 和 max_update 都是具有 datepicker 类的输入。 search_table 是我的表,它是一个数据表。

最佳答案

我从这个 jsfiddle https://jsfiddle.net/bindrid/2bkbx2y3/6/ 得到了另一个替代方案

       $.fn.dataTable.ext.search.push(
          function (settings, data, dataIndex) {
        var min = $('#min').datepicker("getDate");
        var max = $('#max').datepicker("getDate");
        var startDate = new Date(data[4]);
        if (min == null && max == null) { return true; }
        if (min == null && startDate <= max) { return true;}
        if(max == null && startDate >= min) {return true;}
        if (startDate <= max && startDate >= min) { return true; }
        return false;
    }

关于javascript - 使用DatePicker过滤DataTable,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31121292/

相关文章:

javascript - jeditable 扩展提交数据

c# - 关于 C# DataTable.Compute() 的语法

javascript - 单击提交按钮时的 Jquery 表单验证

C# - 传递 DataTable 与 SqlDataReader

java - PrimeFaces 5.1 filterFunction - 是否可以从表中获取整行?

javascript - 无法使用 moment.js 进行格式化

javascript - 在 AngularJS 中注入(inject)原始类型

JavaScript 日期 : How to add a year to a string that contains mm/dd?

javascript - jquery , jquery ui 和 jquery mobile 如何组合在一起

javascript - 构建当前的以类别为中心的导航