dhtmlxgrid:configuration_from_xml [Skin test wiki]

Configuration via XML

The grid can be configured directly in the XML the data is loaded from. In this case, the user needs only 2-3 script commands to get the grid up and running.

Note: do not call grid.init() when configuring the grid from XML.

        grid = new dhtmlXGridObject('gridbox');
        grid.setImagePath("../codebase/imgs/");
        grid.loadXML("gridH.xml"); // XML containing configuration block together with data

All necessary settings, like columns types and dimensions can be specified within XML inside <head> tag. Since v1.2,the user can also specify grid methods to run before or after grid's initialization.

    <rows> 
        <head> 
            <beforeInit> 
                    <call command="methodName"><param>string value</param></call> 
            </beforeInit> 
            <afterInit> 
                    <call command="methodName"><param>string value</param></call> 
            </afterInit> 
            <column width="50" type="ed" align="right" color="white" sort="str">Sales</column>  // the value of <column> tag will be used as a label for a column
            <column width="80" type="co" align="left" sort="str">Shipping
                    <option value="1">1 Day</option>  // specifes combobox and selectbox (for co and coro columns)
                    <option value="7">1 Week</option> 
                    ...
            </column> 
            ...
            <settings> 
                    <colwidth>%</colwidth> // tag value defines uom for width specified in <column width=".." (% - for percents, other value for pixels)
            </settings> 
        </head> 
        <row> 
        ...
        </row>
         ...
    </rows>

Possible attributes for <column> tag are:

width - width in px;
type - type of column (eXcell);
align - align of the text inside;
color - background color for the column;
sort - sorting type;
id - id of the column;
hidden - if the attribute is set, the column will be rendered in hidden state.

Running Grid Methods from XML

    <rows> 
        <head> 
            <beforeInit> 
                    <call command="setSkin"><param>xp</param></call> 
            </beforeInit> 
            <afterInit> 
                    <call command="setColumnHidden"><param>1</param><param>true</param></call> 
            </afterInit> 
            ...
    </head>

The same but called with script:

        grid = new dhtmlXGridObject('gridbox2');
        //...
        grid.setSkin("xp");
        grid.init();
        grid.setColumnHidden(1,true);