There are many customization points about table style and display options. The default default value constant appears in parenthesis after each property. For defails about customizing the default values, click here.
The width (JST_DEFAULT_WIDTH), align (JST_DEFAULT_ALIGN),
border (JST_DEFAULT_BORDER), padding (JST_DEFAULT_PADDING)
and spacing (JST_DEFAULT_SPACING) reflects those attributes on the
TABLE element (spacing is cellspacing and padding is cellpadding).
Column headers may be suppressed by setting showColumnHeaders
(JST_DEFAULT_SHOW_COLUMN_HEADERS) to false.
The table may be set to printing mode, where only data is displayed, without
highlightings, functions or navigation. This is done by setting printing
to true.
Style is set using CSS (Cascading Style Sheet) classes. There are several classes, used for different properties. First, is important to say that, each cell is rendered with a class, and the text has a inner SPAN with another class, to allow text customization and highlighting. So, you will normally see a class for the cell and another for the text.
At a first glance, there are a lot of properties, so, it should be hard to customize. But that's not true,
since you should put all table classes on a css file (which may be different from the file for the rest
of your pages style), and that's done (normally) once per project. You can copy one of the sample themes on the
/samples/themes directory.
Here is the complete list of classes:
| Column Headers | ||
|---|---|---|
| Property | Default Value | Applied to |
| columnHeaderClass | JSTColumnHeader | Header cells |
| columnHeaderTextClass | JSTColumnHeaderText | Header texts |
| highlightedColumnHeaderClass | JSTHighlightedColumnHeader | Header cells when highlighting is enabled and the mouse is over it |
| highlightedColumnHeaderTextClass | JSTHighlightedColumnHeaderText | Header text when highlighting is enabled and the mouse is over it |
| Odd Rows | ||
| Property | Default Value | Applied to |
| oddRowClass | JSTOddRow | TR elements of odd rows |
| highlightedOddRowClass | JSTHighlightedOddRow | TR elements of odd rows when highlighting is enabled and the mouse is over it |
| oddRowCellClass | JSTOddRowCell | TD elements of odd rows |
| highlightedOddRowCellClass | JSTHighlightedOddRowCell | TD elements of odd rows when highlighting is enabled and the mouse is over it |
| oddRowTextClass | JSTOddRowText | Text inside odd rows |
| highlightedOddRowTextClass | JSTHighlightedOddRowText | Text inside odd rows when highlighting is enabled and the mouse is over it |
| oddRowTextWithFunctionClass | JSTOddRowTextWithFunction | Text inside odd rows when there is a cell function |
| highlightedOddRowTextWithFunctionClass | JSTHighlightedOddRowTextWithFunction | Text inside odd rows when there is a cell function, highlighting is enabled and the mouse is over it |
| Even Rows | ||
| Property | Default Value | Applied to |
| evenRowClass | JSTEvenRow | TR elements of even rows |
| highlightedEvenRowClass | JSTHighlightedEvenRow | TR elements of even rows when highlighting is enabled and the mouse is over it |
| evenRowCellClass | JSTEvenRowCell | TD elements of even rows |
| highlightedEvenRowCellClass | JSTHighlightedEvenRowCell | TD elements of even rows when highlighting is enabled and the mouse is over it |
| evenRowTextClass | JSTEvenRowText | Text inside even rows |
| highlightedEvenRowTextClass | JSTHighlightedEvenRowText | Text inside even rows when highlighting is enabled and the mouse is over it |
| evenRowTextWithFunctionClass | JSTEvenRowTextWithFunction | Text inside even rows when there is a cell function |
| highlightedEvenRowTextWithFunctionClass | JSTHighlightedEvenRowTextWithFunction | Text inside even rows when there is a cell function, highlighting is enabled and the mouse is over it |
Highlighting means CSS classes that are used when the user places the mouse cursor inside a row, cell or text.
There are 2 properties (default value constant in parenthesis): rowHighlighting (JST_DEFAULT_ROW_HIGHLIGHTING)
and columnHeaderHighlighting (JST_DEFAULT_COLUMN_HEADER_HIGHLIGHTING) that defines if
highlighting is enabled for rows and column headers. Their possible values are one of these constants:
Important: The column header highlighting does not highlights rows.
| Previous: Row properties |
Table of Contents | Next: User interaction |