How can users toggle whether a column displays in a data table?

App Development
1

I’d like users to be able to select which column(s) they’d like displayed in a data table given a set of fields to choose from.

Ideally, the user can select as many or as few fields as they’d like, and the data table would dynamically update with the user’s selection.

Is this possible?

2

This is certainly possible but requires a bit of code.

It’s a several step process, I’ll outline it here and find where this was built in the past and paste the code.

Here are the steps:

  1. Add a field in the users table where we’ll store their preferences. Usually a text field will suffice.
  2. Add a Mutli-select dropdown where they can choose which options they want to see.
  3. Add a custom class to each column
  4. Set some JS so that when this multi-select is updated, it will update the preferences for the logged in user as well as hide it from view.
  5. Make sure when page loads, it first checks the users preferences and hides the columns as they selected.

I’ll try and post an update within a day or so.

edit: I found the app we did this in a while back. Here’s the outcome. I’ll clean it up a bit and post it first thing in the morning.

user-colum-preferences

As you can see, the preferences are saved for the user when they reload.

3

Thanks for your quick reply, Moe. I will try out this approach!