CODEWITHSUNDEEP
jqueryajaxdatatables
Tex'N'Duet
Tex'N'Duet

Reputation: 321

Datatable datepicker format

I have a problem with multiple filtering on column start date of my table. This column is filled with row data formatted as ('dd-mm-yy'). I apply this format to my datepicker but when it try to filtering data on the table it seems to not working.

This is my Javascript code:

     $(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({ 
        dateFormat: 'dd-mm-yy', onSelect: function () { table.draw(); }, changeMonth: true, changeYear: true  });
        $("#max").datepicker({ 
        dateFormat: 'dd-mm-yy',onSelect: function () { table.draw(); }, changeMonth: true, changeYear: true  });
        var table = $('#example').DataTable();

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

            table.draw();
        });
    });

This is JsFiddle

Upvotes: 1

Views: 711

Answers (1)

Danilo K&#246;rber
Danilo K&#246;rber

Reputation: 910

The line var startDate = new Date(data[4]); is reading your date as mm-dd-yyyy and this brings to invalid dates. Change it to the following line and you are good to go:

var startDate = new Date(data[4].substr(6,4), data[4].substr(3,2)-1, data[4].substr(0,2));

Here is the JSFiddle

Upvotes: 1

Related Questions