Table column initially hidden does not format

[Michael_Hampton]

In my table, I have columns defined like so:

  {key: "dayOne", name: "Day One", type:"string"},
  {key: "goodsDeliveryDate", name: "Goods Delivery Date", type:"string"},

These columns have mapped values

{{formatToCustomDate(self)}}

The first column (dayOne) is initially visible, and formats correctly, the other column "Goods Delivery Date" is not initially visible. When I select the second column, the value shown is not formatted.

If I change the filters on the table, the values in the column format correctly.

In design mode, initially I notice that the type of the visible column is Text, but the type of the hidden column is Auto

When I make the second column visible, the type on the second column changes, but it is not displayed correctly.

Only when I change the filters does the column get formatted.

[Tess]

Hi @Michael_Hampton Thanks for reaching out! I am looking into this. Was it working previously or is it a new set up?

For this part, ({key: "dayOne", name: "Day One", type:"string"}, {key: "goodsDeliveryDate", name: "Goods Delivery Date", type:"string"},), is this something you're setting in the Dynamic column settings feature?

Can we see how you've defined formatToCustomDate?

Thanks!

[Michael_Hampton]

Was it working previously or is it a new set up?

A new set up.

is this something you're setting in the Dynamic column settings feature

Yes

let customDateFormat = "MMM DD, YYYY z (Z)"
/**
* Function for formatting dates like we want.
*/
function formatToCustomDate(theDate) {
  let momentDate = moment(theDate);
  return momentDate.isValid() ? momentDate.format(customDateFormat) : "";
}

[Tess]

Hi @Michael_Hampton

Thanks for these details. It seems like the the table mapper isn't getting re-evaluated after the the column becomes visible.

How are you making the column visible? I'm asking because you could add an event on success that forces the table to re-evaluate the settings. For example, I was able to reproduce this behavior by running a query that changes the dynamic column settings & causes the second column to become visible. I was able to resolve the mapper issue by adding an event on success of the query that changed the dynamic column settings that forces the table to refresh:

Additionally, our team is working on a new table component that has a dynamic hidden setting for each column & isn't impacted by this bug It should be shipping towards the end of this month

[Michael_Hampton]

I just refer to a select with the columns.
Initially it is:

{{
  selectedColumns.selectedItems.length > 0 ?
  Array.from(selectedColumns.selectedItems).map(
    x => ({ name: x.key, type: x.type})) : 
["dayOne", "validity"]
}}

The definitions look like this:

[
  {key: "id",name: "Id", type: "string"},
  {key: "dayOne", name: "Day One", type: "string"},
  {key: "goodsDeliveryDate", name: "Goods Delivery Date", type: "string"},
  {key: "validity", name: "Validity", type: "string", mapper: "{\{ self.titleCase() }\}"}
]
``

[Tess]

Could you add an event on the select that re-sets the table data? Hope that works as a workaround for the time being