Skip to main content
Version: v11.9.2

Custom Styling Data Table Columns & Rows

Scenario: Set the display style of the entire column or row in a Data Table and based upon the value of a particular field. We will customise the Data Table for the following:

  • Department Budget column to be displayed in pink color
  • Zip column to be in blue when the value is 90028 (row.zip=='90028')
  • Row to be displayed as warning when the value is New York (row.city=='New York')

The following style classes have been defined from the Style tab:

.pink { background-color: #F8E0E0; } .blue { background-color: #CEF6F5; } .green { background-color: #D8F6CE; }

Data Table Use Cases