Move filter to the bottom of DataTable

UI Components for React
Post Reply
Posts: 1
Joined: 22 May 2018, 21:59

29 Aug 2018, 18:57

Wondering if there is a setting or something to move the filter bar to the footer of the table instead of the top, or do I need to customize my footer somehow to make it happen?

Not as important to start but would also like to combine dropdown with text for my filter. So list all the options in the column, give the ability to choose one, or they can type it to narrow the list. This I believe will be custom filter code that I can look in to later


Posts: 18352
Joined: 05 Jan 2009, 00:21
Location: Cybertron

03 Sep 2018, 13:19

At the moment, there is no option to move the filters to the footer but we may consider it if there is popular demand. You may use dropdowns as well for filters, please see the demo; ... ble/filter

Posts: 20
Joined: 11 Aug 2018, 11:20

05 Sep 2018, 11:58

the "sDom" value controls the placing of various elements by indicating their relative position within the sDom string.

the default sDom string is lfrtip (see above link for explanation of each letter in the string), so if you want to move the length dropdown (l) and the filter (f), just place them after the table (t)

You may need to edit some of the css associated with those elements in order to get them to place themselves in the way you want.

Code: Select all

$(document).ready(function() {
$('#example').dataTable( {
"sDom": 'rtlfip'
} );
} );

Post Reply

Return to “PrimeReact”

  • Information
  • Who is online

    Users browsing this forum: Google [Bot] and 6 guests