提问者:小点点

如何对jquery数据表进行日期范围筛选?


我使用的是jquery数据表。我在做日期范围筛选。当我选择“最小日期”和“最大日期”时,结果是数据表上没有筛选数据。我用了剧本

null

$(document).ready(function() {

  var table1 = $('#sample_2').DataTable({
    dom: 'Bfrtip',
    buttons: [
      'copy', 'csv', 'excel', 'pdf', 'print',
    ]
  });

  $.fn.dataTable.ext.search.push(
    function(settings, data, dataIndex) {
      //var min = $('#min').datepicker("getDate");
      // var max = $('#max').datepicker("getDate");
      var min = $('#min').datepicker({
        dateFormat: 'yyyy-mm-dd'
      }).val();
      var max = $('#max').datepicker({
        dateFormat: 'yyyy-mm-dd'
      }).val();
      //console.log(min);
      console.log(min);
      console.log(max);
      //var startDate = new Date(data[4]);
      var today = new Date();
      var dd = today.getDate();
      var mm = today.getMonth() + 1; //January is 0!

      var yyyy = today.getFullYear();
      if (dd < 10) {
        dd = '0' + dd;
      }
      if (mm < 10) {
        mm = '0' + mm;
      }
      var today = yyyy + '-' + mm + '-' + dd;
      var startDate = today;
      console.log(startDate);

      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;
    }
  );


  $("#min").datepicker({
    onSelect: function() {
      table1.draw();
    },
    changeMonth: true,
    changeYear: true
  });
  $("#max").datepicker({
    onSelect: function() {
      table1.draw();
    },
    changeMonth: true,
    changeYear: true
  });

  // Event listener to the two range filtering inputs to redraw on input
  $('#min, #max').change(function() {
    table1.draw();
  });
});

null

null

$(document).ready(function() {

  var table1 = $('#sample_2').DataTable({
    dom: 'Bfrtip',
    buttons: [
      'copy', 'csv', 'excel', 'pdf', 'print',
    ]
  });

  $.fn.dataTable.ext.search.push(
    function(settings, data, dataIndex) {
      //var min = $('#min').datepicker("getDate");
      // var max = $('#max').datepicker("getDate");
      var min = $('#min').datepicker({
        dateFormat: 'yyyy-mm-dd'
      }).val();
      var max = $('#max').datepicker({
        dateFormat: 'yyyy-mm-dd'
      }).val();
      //console.log(min);
      console.log(min);
      console.log(max);
      //var startDate = new Date(data[4]);
      var today = new Date();
      var dd = today.getDate();
      var mm = today.getMonth() + 1; //January is 0!

      var yyyy = today.getFullYear();
      if (dd < 10) {
        dd = '0' + dd;
      }
      if (mm < 10) {
        mm = '0' + mm;
      }
      var today = yyyy + '-' + mm + '-' + dd;
      var startDate = today;
      console.log(startDate);

      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;
    }
  );


  $("#min").datepicker({
    onSelect: function() {
      table1.draw();
    },
    changeMonth: true,
    changeYear: true
  });
  $("#max").datepicker({
    onSelect: function() {
      table1.draw();
    },
    changeMonth: true,
    changeYear: true
  });

  // Event listener to the two range filtering inputs to redraw on input
  $('#min, #max').change(function() {
    table1.draw();
  });
});

null

日期格式为YYYY-MM-DD。每次我用日期范围搜索时,结果不会出现在数据表中。请帮帮我,我哪里做错了。谢谢。


共1个答案

匿名用户

在任何编程语言中,都应该尽量避免对日期进行完全的字符串比较。

直接比较一下你们的日期,或者如果一定要的话,比较一下它们的数值。

在使用日期字符串时,您已经落入了一个陷阱,其中一个使用“-”,另一个使用“/”,它具有不同的ascii值,因此具有不同的><排序顺序。此外,当您需要跨越不同年份时,顺序mm-dd-yyyy而不是yyyy-mm-dd也不会有帮助。

一开始最好避免将它们转换成字符串进行比较。