CSS Classes for FlexGrid control are as follows:
Class |
Description |
---|---|
.wj-flexgrid |
Styles the div host element of the FlexGrid control. |
.wj-topleft .wj-cell |
Styles the TopLeft corner cell/cells. |
.wj-colheaders .wj-cell |
Styles all the column header cells. |
.wj-rowheaders .wj-cell |
Styles all the row header cells. |
.wj-header |
Styles the header cells including column header, row header and top left cell. |
.wj-row .wj-cell |
Styles all the rows in grid. |
.wj-alt |
Styles the alternative rows in grid. |
.wj-cells .wj-cell |
Styles all the cells in the scrollable area (data cells). |
.wj-cell |
Styles all the cells in grid including column header, row header and top left cell. |
.wj-bottomleft .wj-cell |
Styles the div element containing cells collection for bottom left area. |
.wj-colfooters .wj-cell |
Styles the div element containing cells collection for column footers. |
.wj-align-right |
Styles the right aligned columns. |
.wj-align-center |
Styles the center aligned columns. |
Selection |
|
.wj-state-selected |
Styles the active cell and currently selected item in the drop down list. |
.wj-state-multi-selected |
Styles all the cells in the selected cell range except the active cell. |
.wj-marquee |
Styles the Excel-style element that highlights the selection when the showMarquee property is set to true. |
.wj-state-active |
Styles the active cell. |
.wj-colheaders .wj-state-multi-selected |
Styles the selected column headers when the showSelectedHeaders property is set to true. |
.wj-rowheaders .wj-state-multi-selected |
Styles the selected row headers when the showSelectedHeaders property is set to true. |
Editing |
|
.wj-grid-editor |
Styles the cell editor element. |
.wj-glyph-pencil |
Styles the pencil icon displayed in the row header of the currently editing row. |
.wj-glyph-asterisk |
Styles the asterisk icon displayed in the row header of the new row template. |
Validation |
|
.wj-state-invalid |
Styles the invalid cells. |
Freezing |
|
.wj-frozen |
Styles non-header frozen cells. |
.wj-frozen-row |
Styles cells in the last frozen row. This style can be used to create a horizontal divider line between the frozen and scrollable rows. |
.wj-frozen-col |
Styles cells in the last frozen column. This style can be used to create a vertical divider line between the frozen and scrollable columns. |
Sorting |
|
.wj-glyph-up |
Styles the up-arrow icon displayed in the column header of a column sorted in ascending order. |
.wj-glyph-down |
Styles the down-arrow icon displayed in the column header of a column sorted in descending order. |
Grouping |
|
.wj-group |
Styles the group row. |
.wj-glyph-down-right |
Styles the expand icon displayed in the group row for the expanded group. |
.wj-glyph-right |
Styles the collapse icon displayed in the group row for the collapsed group. |
.wj-grouppanel |
Styles the div host element for GroupPanel control. |
.wj-groupmarker |
Styles the div element for each grouped column displayed in the GroupPanel control. |
.wj-remove |
Styles the (x) mark displayed in the group panel for each column header element. |
Filtering |
|
.wj-glyph-filter |
Styles the filter icon displayed in column headers. |
.wj-filter-on |
Styles the filter icon when the column has been filtered. |
.wj-filter-off |
Styles the filter icon when the column has not been filtered. |
.wj-columnfiltereditor |
Styles the div host element for FilerDialog. |
.wj-valuefilter-editor |
Styles the div host element for Value Filter. |
.wj-conditionfilter-editor |
Styles the div host element for Condtion Filter. |
Drag Drop |
|
.wj-marker |
Styles the marker displayed in the row/column header of the row/column where the dragged row/column will be dropped. |
.wj-state-dragsrc |
Styles the target row/column which is being dragged. |
RowDetail |
|
.wj-glyph-plus |
Styles the Plus icon displayed in the row headers of the collapsed detail row. |
.wj-glyph-minus |
Styles the Minus icon displayed in the row headers for the expanded detail row. |