SMART datagrid v.1 > Examples

Back  Forward

CellStyles  Example

CellStyle is a set of the style and edit properties which can be set by each data cell. Unlike the column style or dynamic style, the criteria of CellStyle is the data row and fields. However, it does not mean CellStyle will be saved in DataSet. If two grids are connected to one data set, CellStyle which is applied to one of the grids will not be applied to the other one. Like other styles, CellStyle is also managed in View layer. 

Since each style has its advantages and disadvantages, you should choose an appropriate styling approach for your situation. 

In order to apply CellStyle to the data cell, you should register it in the grid first. You can approach each CellStyle by Style ID

Code -1
    grdMain.registerCellStyle('style01', {
        "background": "#880000",
        "color": "#ffffff"
    });

In order to apply the cell style to each data cell, you can use GridBase.setCellStyle method. If dataRowIndex parameter is less than 0, it will be applied to the row you add. 

You can specify the field index or name in field, and If specify as -1, it will be applied to all cells of dataRowIndex row. 

white letters on a red ground  white letters on a blue ground 

Grid - 1
rows

You can also set to multiple rows through GridBase.setCellStyles

red letters on a yellow ground 

You can also set to multiple rows and fields. 

white letters on a green ground 


Specify an individual style to multiple cells

You can also specify different styles respectively to the multiple rows and fields of DataSet with using GridBase.setCellStyleRows. As in the example below, you can specify an array of arrays with one or more style id values or an array of JSON object like the field map. 

In the field map, you can set how to apply the location value of the style array in the field of the data set. Please refer to setCellStyleRows help topic for more details. 

Set as an array of arrays. 

Set as JSON array. 

Grid - 2
rows

View Source JSP 

See Also
CellStyle
GridBase.registerCellStyle
GridBase.setCellStyle
Examples
Column Styles
Row Styles