How to reset values in individual column searching (text inputs) at a button click

Newcomsas

I would like to be able to reset all the values in individual column search inputs at the click on a custom 'Reset' button in the table. Could you suggest me how to obtain this behaviour ? TIA

kthorngren

columns().search() with a blank ("") value will clear the column search. Make sure to use draw(). Also you will need to clear the search inputs, Datatables doesn't do this.

Kevin

colin

Hi @Newcomsas ,

Those column server inputs aren't part of DataTables, they'll be HTML elements that you added yourself, so to clear, just use standard JS /Jquery code.

Cheers,

Colin

Newcomsas

Here is a working code. Every other combination did not work.
I have to clear all the textboxes via Jquery and then call the draw() method for every column and the general search textbox.

   buttons: [
      {
        text: 'Reset',
        className:'btn btn-warning',
        header: true,
        action: function ( e, dt, node, config ) {


            $("input[type='text']").each(function () {  
                $(this).val('');  
            })

            dt.columns().every( function () {
                var column = this;
                column
                        .search( '' )
                        .draw();
            } );

            dt.search('').draw();

        }
      }
   ],

kthorngren

I would suggest removing the .draw() from this:

             column
                     .search( '' )
                     .draw();

Since you are doing the draw here: dt.search('').draw();

This might be more efficient (or at least more readable) than using the every loop:
dt.columns().search('')

Kevin