How to make column headers clickable?

💬 App Building
1

Is there some way to make column header clickable in Retool?

3

Hello @engineering-tajir, the column header in the Table component is currently clickable, but it is reserved for sorting. My recommendation is to use a regular column cell as the clickable area instead, since that is what it is intended for.

If you really need to make the column header clickable, there is a workaround, but it can cause a small visual glitch. Here is how you can set it up

  1. In the Event Handler for your Table component, set
    Event to Change sort
    Action to Run script
  2. In the script, you can add whatever logic you want to run when the column header is clicked. At the end of your code, make sure to include table1.clearSort();
    This clears the default sorting after the click. The tradeoff is that you will see a slight glitch when the header is clicked, which is why this is not my first recommendation.

Let me know if that makes sense at all, and we can brainstorm other ways to approach this! :brain:

1 Like
4

Hello again @engineering-tajir what did you think of the suggestion above? If it works well for your use case, would you mind checking the solution box for visibility? Thank you! If not, no worries at all, let me know and we can definitely work through other options together! :pray: