topic Re: How to customize FeatureTable column and row size in ArcGIS JavaScript Maps SDK Questions

How to customize FeatureTable column and row size

Caitlin_Dickinson — Thu, 20 May 2021 15:47:31 GMT

I’d like to set the default width of columns and height of the rows in the FeatureTable widget to accommodate more of the text in an attribute field. All of the sample code examples have the overflow text hidden, and no wrapping enabled:

I am using the FeatureTable widget without a map, so one cannot click on a feature to view a popup that contains the full attribute text.

My questions are: is it possible to either (a) set the default width and height of all rows, or (b) have them dynamically change height to fit the text in a given column? I’ve poked around a bit in the CSS, and it seems that this is not controlled by the esri-grid, esri-widget, esri-grid__content, or esri-grid__grid classes.

Thanks for your help!

Re: How to customize FeatureTable column and row size

rpavuluri — Fri, 29 Oct 2021 02:20:28 GMT

Hi @Caitlin_Dickinson ,

I am assuming you are referring to JSAPI 4.x. The following css snippet helped me with b) using 4.21 version. FYI, this might break with a new JSAPI release.

vaadin-grid-cell-content {
white-space: normal !important;
}

Re: How to customize FeatureTable column and row size

Caitlin_Dickinson — Fri, 03 Dec 2021 18:50:47 GMT

Wonderful, thank you @rpavuluri for this fix! This works great using 4.21. Will continue to monitor in future releases. As an example, here it is implemented in the FeatureTable widget with a map example: