Custom filter does not work

Custom filter does not work

jens.olssonjens.olsson Posts: 17Questions: 7Answers: 1

Hi

I need to create a custom filter with the following requirements:
- I want the quick filter text field in the top right corner to still work
- I have certain rows where column 3 is set to "on" that should always be displayed

So far I have tried with:

$.fn.dataTable.ext.search.push(
function (settings, searchData, index, rowData, counter) {
if (searchData[3] == "on")
return true;
return false;
}
);

However it does not work since I guess both the standard filter and this filter will remove rows.

My idea so far is to:
Instead of pushing this filter to the array maybe I can replace the current filter? If so I need to add logic so that I will search for the text entered in the text field. But how can I from the filter retrieve the standard quick search text field value?

Is it doable?

Answers

  • kthorngrenkthorngren Posts: 21,448Questions: 26Answers: 4,974
    edited April 2019

    However it does not work since I guess both the standard filter and this filter will remove rows.

    Yes, basically the global search works first then the plugin function processes only those rows left after Datatables has filtered the rows. Unfortunately you can't add them back in this way.

    Probably what I would do is take over the default global search input to stop it from searching first. Then use the search plugin to return true for the rows with column 3 set to on then continue the normal search for the remaining rows. Here is an example you can start from:
    http://live.datatables.net/yisaqore/1/edit

    My understanding is that Datatables takes each row and combines the row data into a string then performs the search within the string. My example simulates this but I'm not sure it is exactly how Datatables does it. It seems to work the same as "Smart" searching.

    In the example all rows with Edinburgh should always show. Search for ashton and you will see.

    Kevin

  • jens.olssonjens.olsson Posts: 17Questions: 7Answers: 1

    Thanks a lot for this @kthorngren it actually works exactly like I want it to. I was kind of thinking in this direction but I never figured out how to get rid of the standard search functionality. Actually I have no need to mimic the original search functionality so this will be just fine even if it is not exactly the same.

    Question is if this is a future proof and complete solution to remove the standard search:
    $('.dataTables_filter input')
    .off()
    .on('keyup', function() {
    // Draw the table to execute the search plugin
    table.draw();
    });
    }

    Is the standard search only executed on keyup?

    Kind regards
    Jens

  • colincolin Posts: 15,240Questions: 1Answers: 2,599

    Hi @jens.olsson ,

    This is the code that binds the events:

            var jqFilter = $('input', filter)
                .val( previousSearch.sSearch )
                .attr( 'placeholder', language.sSearchPlaceholder )
                .bind(
                    'keyup.DT search.DT input.DT paste.DT cut.DT',
                    searchDelay ?
                        _fnThrottle( searchFn, searchDelay ) :
                        searchFn
                )
                .bind( 'keypress.DT', function(e) {
                    /* Prevent form submission */
                    if ( e.keyCode == 13 ) {
                        return false;
                    }
                } )
                .attr('aria-controls', tableId);
    

    If you're not worried about cut&paste, then Kevin's solution is spot-on. If you are, you could add those events back in too.

    Cheers,

    Colin

This discussion has been closed.