range_dates plugin filters rows correctly, but unexpectedly shows or hides filtered rows

stevepiercy

I modified the range_dates.js plugin to parse and filter ISO 8601 dates (yyyy-mm-dd).

I have created a test case at:
http://live.datatables.net/nuxasuxa/2

To replicate the issue:
1. Select Start Date == 2018-12-01. Immediately all records are filtered out, but all 15 should display.
2. Select End Date == 2018-12-25. All records remain filtered out, but 8 records should display.
3. Tab back and forth through Search Record Name and End Date. 8 records will hide and display, but 8 records should display.
4. Repeat Steps 1 and 2, but type the date manually to experience the same issue.
5. Remove the datepicker initialization, and repeat Steps 1 and 2 to experience the same issue.

I've tried changing events between keyup, change, blur, focus, etc., but that had no effect.

How can I fix this UI issue?

allan

Your filter is actually working correctly. But this block of code isn't doing what is expected:

    // Filter by Record Name
    table.columns([3]).every( function () {
        var that = this;

        $( 'input' ).on( 'keyup change', function () {
            if ( that.search() !== this.value ) {
                that
                    .search( this.value )
                    .draw();
            }
        } );
    } );

Specifically it is adding a keyup and change event to every input on the page, not just the one in that column. So in fact the start date is being applied as a column filter to the record name column which is why it is filtering everything out.

You need to limit its scope - $('input', this.footer()) perhaps (although i don't see a footer cell there so that might not solve it).

Allan

stevepiercy

FTR, changing the selector of the record name input to input#record-name did the trick. Thank you!