How To Reset Search That Contains Date Filter Range?

asyadiqin

I have a datatable with 3 search filters with 2 buttons which is RESET and FILTER :-
1. Status
2. Facility Name
3. Date Filter : 2 date fields which FROM_DATE and TO_DATE

The search function works fine with any combination of the filters. However, if I used the date range, clicking on the RESET does not reset the datatable and redraw with the full original results but only shows the result of the last search using the date range filter. These is my RESET function:

        $('#kt_reset').on('click', function(e) {
            e.preventDefault();
            $('.kt-input').each(function() {
                $(this).val('');
                table.column($(this).data('col-index')).search('', false, false);
            });
            table.table().search("").draw();
        });

If I were to search without using the date filter, the RESET button works as normal. What am I doing wrong? Thanks.

kthorngren

To reset the column search use table.column(0).search("").draw() to reset column 0. Use table.columns().search("").draw(); to reset the search for all columns. You will manually need to reset your inputs to the values you want.

Kevin

asyadiqin

Tried this but same thing... Works with other search filters but if I defined the date filter, RESET will not work and still show the filtered result.

    $('#kt_reset').on('click', function(e) {
        e.preventDefault();
        $('.kt-input').each(function() {
            $(this).val('');
            table.column($(this).data('col-index')).search('', false, false);
        });
        table.columns().search("").draw();
    });

asyadiqin

This is my function for the date filter.

// Start Date Range Search
$.fn.dataTable.ext.search.push(
  function (settings, data, dataIndex) {
    // Get date filters
    var min = $('#min').datepicker("getDate");
    var max = $('#max').datepicker("getDate");

    // Convert to UNIX timestamp
    var minTS = moment(min).unix(); 
    var maxTS = moment(max).unix();

    // Get current date value and convert to UNIX timestamp
    var curDate = data[1];   // Column containing the date to filter
    var dateTS  = moment(curDate).unix();

    // Process date filters
    if (min == null && max == null) { 
      return true; 
    }
    if (min == null && dateTS <= maxTS) {
      return true; 
    }
    if (max == null && dateTS >= minTS) { 
      return true; 
    }
    if (dateTS <= maxTS && dateTS >= minTS) {
      return true; 
    }

    return false;
  }
);
// End date range filters 

Could this be the cause of this issue? For me, it looks like that the data used by the date filter is not being cleared as the datatable still shows the same exact records. Any new idea how to fix this?

colin

We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

Cheers,

Colin