Sorting via both the table header & table footer

Sorting via both the table header & table footer

TerryNairTerryNair Posts: 3Questions: 2Answers: 0

<thead> as a norm, displays the up/down arrow sort keys to sort columns. That is a given. What I like to do is to have the same sort feature in the header be repeated and displayed in the footer (tfoot) as well. The idea is that when folks scroll to the bottom of the web page (table head not visible now), the table footer has the same sorting goodies the user can use. No need to scroll the web page back up.

Can this be done ...sorting feature at the head and foot of the same table. Many thanks folks.

Cheers TDn

Answers

  • allanallan Posts: 61,435Questions: 1Answers: 10,049 Site admin

    Yes this can be done, although you'll need a line of two of code to do it, rather than just enabling an option. You can use order.listener() to attach an ordering listener to any element on the page - in this case you would loop over the footer cells, adding that to each cell.

    Allan

  • allanallan Posts: 61,435Questions: 1Answers: 10,049 Site admin

    One thing to note, that method won't add the order icons into the footer. The only way to do that would be to copy the classes from the header into the footer cells and also update the CSS to allow the icons to display in the footer as well.

    Allan

  • colincolin Posts: 15,112Questions: 1Answers: 2,583

    This is an example of that here.

    Colin

This discussion has been closed.