如何在窗口加载时过滤数据表日期范围?

时间:2018-03-09 12:34:57

标签: javascript jquery jquery-ui datatables jquery-ui-datepicker

当用户点击两个输入时,我有以下脚本正常工作,这两个输入是datepicker选择日期,结果显示正确相应的日期选择。JsFiddle 对于Datepicker,我使用的是jquery Ui库。 现在我想在窗口加载上运行此函数。并在maxmin变量上设置默认值。忘掉两个inputs.i设置两个日期默认值并在窗口加载时运行我的脚本在

下面
$( "#min" ).datepicker({ dateFormat: 'M-d-y' });
  $( "#max" ).datepicker({ dateFormat: 'M-d-y' });
   $(document).ready(function(){
    $.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;
    }
    );

        $("#min").datepicker({ onSelect: function () { table.draw(); }, changeMonth: true, changeYear: true });
        $("#max").datepicker({ onSelect: function () { table.draw(); }, changeMonth: true, changeYear: true });
        var table = $('#html-table').DataTable();

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

        });
        });

我正在尝试在窗口加载时加载此函数,并将默认值设置为minmax变量,但不显示结果。

    $( "#min" ).datepicker({ dateFormat: 'M-d-y' });
   $( "#max" ).datepicker({ dateFormat: 'M-d-y' });
   $(document).ready(function(){
    $.fn.dataTable.ext.search.push(
    function (settings, data, dataIndex) {
    var min = $('#min').datepicker("setDate", new Date('Apr-06-17') );
    var max = $('#max').datepicker("setDate", new Date('Apr-14-17') );
    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;
}
   );

    $("#min").datepicker({ onSelect: function () { table.draw(); }, changeMonth: true, changeYear: true });
    $("#max").datepicker({ onSelect: function () { table.draw(); }, changeMonth: true, changeYear: true });
    var table = $('#html-table').DataTable();

    // Event listener to the two range filtering inputs to redraw on input

        table.draw();


    });

0 个答案:

没有答案