Grid rows
This guide covers grid rows functions. They allow you to define how rows should be structured, including horizontal grid, vertical grid and row coloring. The rows styling can be set in three different ways: 'Even'
, 'Odd'
or 'None'
. It is simple and easy just add one of the functions in the grid configuration selector.
On the example below you can check following functions:
- Horizontal grid,
- Vertical grid,
- Row coloring:
None
,Odd
,Even
.
$('#jquery-rows-grid').guiGrid({
columns: [{
header: 'Number',
field: 'number',
type: 'number',
width: 80
}, {
header: 'Name',
field: 'name',
view: 'italic'
}, {
header: 'Position',
field: 'position',
view: 'bold',
width: 100
}, {
header: 'Team',
field: 'team'
}],
theme: 'Generic',
source: source,
horizontalGrid: true,
verticalGrid: true,
rowColoring: 'none'
});
Row - options
Options | Type | Default | Description |
---|---|---|---|
horizontalGrid | boolean | true | Enables horizontal lines that separate rows within the grid. |
verticalGrid | boolean | true | Enables vertical lines that separate columns within the grid. |
rowColoring | string | 'Even' | Applies colored shading to the grid rows. Available shading options: 'None' , 'Odd' , 'Even' . |