How to implement dynamic column settings

If the data schema for your table may change over time, you may want to use dynamic column settings. You might consider this solution if you have more than one data source that will populate a single table or if your underlying data schema is expected to change - such as anticipating new columns being added to your table.

:sparkles: Here's an example: :sparkles:

In this sample app, I have a table that shows software engineering projects:

:question: I want to configure this exact same table to optionally show online course data, based on user selection. This could be done in many ways, but for sample purposes, I created a form so that the user can select one of two views - software engineering projects or online computer science courses:

These are the two schemas:

:eyes: When I switch the table display to online courses, I see that the table is still trying to show me the project columns, which, of course, have no data in the online courses view:

:repeat: In edit mode, I can click "regenerate columns" to solve for this, but that won't help my end users. To ensure the table always has the right column data, I'm going to enable dynamic column settings (Content->Advanced):

:negative_squared_cross_mark: Now I have the expected columns for online courses, but the empty project columns are stil showing. To solve for this, I'm going to delete all of the columns (click the x button next to each one) that should only show dynamically. I don't need to worry about the fact that I'm deleting these columns because they'll be re-created dynamically via the dynamic column settings

image

:dizzy: The dynamic columns settings have a few options for customizing the dynamically generated columns, such as whether they're editable:

:warning: Keep in mind that dynamic column settings currently have some limitations: :warning:

  1. You can't have a dynamic primary key, so if the primary key will change dynamically, this solution may not be a good fit.

  2. You can't access more advanced column settings for your dynamic columns, such as captions, tooltips, etc

  3. You can't add mapped values or set column colors

We'll keep iterating on what's available in the dynamic column settings, so definitely let us know what you'd like to see! :ship:

If you find that dynamic column settings don't quite meet your needs yet, you could instead have multiple tables on the same place on the cavas that are hidden/shown dynamically.

14 Likes

Here's that label renaming if anyone wants an easy copy paste

{{item.replaceAll('_',' ').split(' ').map(x=>x[0].toUpperCase()+x.substring(1)).join(' ')}}

1 Like

Is there a way to format the cell of a dynamic column? Say the value is 0 then the background color should be red else green

Not yet :disappointed: We have a feature request for this, so I'll post here when it ships

You could use the row color based on the currentSourceRow...but this would apply to all rows (if you have any non-dynamic columns you could set those back to a white background in their individual column settings)

1 Like

Hi @Tess
Can I somehow set the Mapped value, Caption, Status indicator, and Background for each dynamic column? Maybe somewhere in .js?

Not currently :disappointed:, but it's a feature request in our backlog

1 Like

Hi @Tess, how exactly do the dynamic columns get auto generated? Is it taking the aggregate of all the keys from the data source? Also, is there a limit to the number of dynamic columns that can be displayed in the table?

My test collection in mongo has over 60 different keys but initially, they don't show up in the table. I have noticed that when I add an additional filter dropdown, which is used in fetching the data from mongo, the dynamic columns show up. So something tells me that when you are dealing with large amounts of data there is some limitation to displaying dynamic columns.

In my table I have a 36 static columns that will always be displayed, then it uses the dynamic columns feature to display the rest of the columns, up to 30 more.

Hmm I haven't be able to reproduce a delay, even with that amount of columns :thinking: the columns should be generated when the underlying query runs (based on any keys that aren't in the static columns). There is not a limit to the number of dynamic columns.

Could you share a screen recording?

1 Like

Hi there, if I'm reading the above correctly, I can't have the color of a tag in a dynamic column react to its content, right? I'm trying have tags that say "fail" be red, and ones that say "pass" be green....

I currently have a query that returns one of two values for a dynamic column: pass or fail. In the dynamic column settings, I am trying to set the color as shown below

The two things I have tried for in the color configuration box are

{{ item === 'pass'? 'green':'red'}}

and

{{ item.startsWith('pass')? 'green':'red'}}

But neither one adjusts the color of the tags in the column

Hmm you might be able to get away with self. Item is the key name, rather than the value

1 Like