Basic data Basic config Advanced Full
Plain view (html) Plain view (pdf)

<?xml version="1.0" encoding="iso-8859-1" ?> #encoding can be important <rows pos="123" total_count="2000"> <head> #optional header configuration <column type="edn" width="150" sort="str" format="0.00"> Column label </column> <column type="ro" width="150" sort="na" color="red"> One more label </column> <column type="co" width="150" sort="na" id="last">Combo <option value="1">One</option> <option value="2">Two</option> <option value="3">Three</option> </column> <settings> #optional, only used for forcing percent based width <colwidth>px</colwidth> <splitat>2</splitat> </settings> <beforeInit> <call command="enableResizing"> <param>false,false</param> </call> </beforeInit> <afterInit> <call command="attachHeader"> <param>Label 2-1,Label 2-2</param> </call> <call command="attachFooter"> # there may be as many command calls as necessary <param>Footer 1,Footer 2</param> </call> </afterInit> </head> <userdata name="some_1"></userdata> #global userdata <row id="11"> <userdata name="some_1">value_1</userdata> #row specific userdata <cell> first column data </cell> <cell> second column data </cell> </row> <row id="12" class="css1" bgColor="red" style="color:blue;"> <cell> first column data </cell> <cell class="css2" style="font-weight:bold;"> second column data </cell> </row> <row id="13" locked="true" > <cell colspan="2" rowspan="1"> first column data </cell> <cell></cell> </row> <row id="14" selected="true" call="true"> <cell type="ro"> first column data </cell> <cell></cell> </row> <row id="15"> <cell><![CDATA[ <input type='button' value='any' /> ]]></cell> <cell> second column data </cell> </row> <row id="16"> <cell> &lt;input type='button' value='any' /&gt; </cell> <cell> second column data </cell> </row> </rows> <?xml version="1.0" ?> <rows> #top xml tag, mandatory <row id="11"> #each row must have unique ID <cell> first column data </cell> <cell> second column data </cell> </row> <row id="12"> <cell><![CDATA[ <input type='button' value='any' /> #any hmtl can be stored inside CDATA ]]></cell> <cell> second column data </cell> </row> <row id="13"> <cell> &lt;input type='button' value='any' /&gt; </cell> #or it can be correctly escaped <cell> second column data </cell> </row> </rows> <?xml version="1.0" ?> <rows> <head> <column type="edn" width="150" sort="str" format="0.00"> #column defined as readonly , 150px width Column label #label of column </column> <column type="ro" width="150" sort="na" color="red"> #not sortable column One more label </column> <column type="co" width="150" sort="na" id="last">Combo #combobox column <option value="1">One</option> <option value="2">Two</option> #values|labels of combobox values <option value="3">Three</option> </column> </head> </rows> <?xml version="1.0" ?> <rows pos="123" total_count="2000"> #smart rendering related attributes <userdata name="some_1"></userdata> #global userdata <row id="11"> <userdata name="some_1">value_1</userdata> #row specific userdata <cell> first column data </cell> <cell> second column data </cell> </row> <row id="12" class="css1" bgColor="red" style="color:blue;"> #there are few ways to set styles of row <cell> first column data </cell> <cell class="css2" style="font-weight:bold;"> second column data </cell> #same for cell </row> <row id="13" locked="true" > #not editable row <cell colspan="2" rowspan="1"> first column data </cell> #colspan in grid <cell></cell> #the second cell included in colspan still present as empty tag </row> <row id="14" selected="true" call="true"> #auto-selected after data loading <cell type="ro"> first column data </cell> #cell will be rendered as "ro" without relation to column type <cell></cell> </row> </rows>
To store some additional data, which need not to be displayed, but may be useful for some client side operations - userdata sections can be used.
Because there may be many userdata tags per row|grid, they differ by name attribute. Value of name attribute used on client side to get related value.

### column

in case of configuration from XML it represent column of grid
value of tag used as column label

#### Optional attributes

- type - type of column editor (ro,ed,co etc.)
- sort - type of sorting used for column (str,int,date)
- width - width of column ( set as pure integer, can be percents or pixels [default] )
- align - default align for current column
- id - ID of column, really optional parameter
- color - color of column
- format - format of data in column ( for specific excells only )
Width of column in percents or pixels, need to be specified as pure int, without ending px
By default treated as width in pixels, can be switched to percents by using "setting/colwidth" tag
Default column type ( equal to setColTypes - ro,ed,co and etc. )
Horizontal align of column ( left, right, center ; equal to setColAlign )
Color of column ( equal to setColumnColor )
Allows to set sorting type ( equal to setColSotring command - str,int,date)
If you need to set custom routine just set name of javascript function here which will be used for such task. ( Its name must have more than 4 chars )
For "edn" and "calendar" excells format can be specified ( equal to calling setNumberFormat or setDateFormat against related column )
Will not affect any other column types.
Each column has ID, it has sense when you are using movable columns and column index not consistent enough
While grid API uses indexes for all operations it provides API to convert IDs to indexes and back ( getColumnId, getColIndexById )
Group grid configuration settings, has no individual meaning
Allow to specify how treat column width specified in "column@width". Value of tag can be
- px - width will be set as pixels ( default value, tag may be skipped in such case )
- % - width will be set as percents
Execute splitAt command in required position, functionality is kind of deprecated, and it recommended to use afterInit/call to initiate split
Allow to define list of options for excell which can work with such conception ( co, coro, clist, in theory any custom excell which has inner combo property )
Content of tag used as option label
"value" attribute is mandatory
value for related option inside combobox

### row

tag represent row of grid, one tag for each row

#### Mandatory attributes

- id - ID of row, must be unique per grid

#### Optional attributes

- class - css class
- style - css text
- locked - force readonly mode
- bgColor - background color
- selected - pre-select row
- call - extend selection
unique identificator, can be any combination of chars|numbers
name of css class which will be attached to row
string with css definitions, which will be set as style attribute of related row
row will be locked - switched to read-only state, can be reverted by JS API
after data loading, row will be pre-selected
has sense only with enabled "selected" attribute, if both attributes set to true - row will be selected and onSelectRow event will be called
the color of row, it is strongly recommended to use this parameter to set color of row ( all other ways will override selection colors )

### head

optional tag, used for grouping configuration tags ( necessary only if you want to define configuration in XML )
no attributes supported

### rows

just top xml tag, has no special meaning

#### Optional attributes

- pos - position from which xml must be inserted in existing dataset of grid, actual only for SRND mode
- total_count - expected count of rows, can be useful only in dynamic SRND or dynamic paging modes
In case of dynamic smart rendering XML fetched from server by chunks, the "pos" attribute shows in which place of grid data from incoming XML must be inserted.
In most cases ( the exceptions are pretty specific ) this value will be equal to url parameter "posStart" ( which automatically added to all calls in SRND mode )
Attribute has meaning only in SRND mode and will be ignored in any other.
Both dynamic paging and dynamic rendering modes require to specify maximum expected count of rows ( paging can work without such limit, but it will not show all available pages from the start in such case )
Because hardcoding count or rows in javascript code is rare possible, it can be specified directly in XML.
If value skipped in SRND mode - the total count set to size of incoming XML ( basically dynamic smart rendering switch to static smart rendering) If value skipped in paging mode - grid will request additional data from server until empty XML set will not be returned. Attribute has no meaning in non dynamic modes.

### cell

represent cell of grid, value of tag will be used as value of cell in grid

#### Optional attributes

- type - type of cell, will redefine default type for column
- class - name of css class
- style - css text
- colspan - optional columns grouping
- rowspan - optional rows grouping
css style string, value mapped to style attribute of HTML cell
few cells can be grouped in rowspan, please beware that other cells, which will be included in colspan still need to be present in XML
support of attribute must be enabled by API call
few cells can be grouped in rowspan, feature is mutual exclusive with colspan ( cell can has colspan and rowspan in same time )
please beware that having multiple rowspan will slowdown grid
_rowspan.js extension required to activate feature
type of used cell defined per column ( setColTypes ), but each cell in grid can have independent settings, so even if you have editable column you can define specified cells as readonly or checkboxes or some other control, by using this attribute
css class which will be attached to cell
group all command calls which will be executed after grid structure initialized
command from this block will be executed even if no data structure tags ( column ) defined in header
group all command calls which will be executed before grid structure initialized
command from this block will be executed only if full grid structure defined in XML ( column tags )

### call

represent call of grid command, must be placed in afterInit or beforeInit section

#### Mandatory attributes

- command - name of grid method which will be called, parameters of method taken from nested param tags
name of grid method which will be called.
represent parameter of method call, there must be as much param tags as necessary