Loading Additional Data to Grid

To load additional data to the grid you can use:

Hidden Columns.
Userdata.
Custom attributes.

Hidden Columns

To make some extra data in the grid invisible, you can hide some column(s). So, the data in such column(s) will be invisible to users but accessible by API.

To hide a column, use the setColumnHidden method:

mygrid = new dhtmlXGridObject('gridbox');  
mygrid.setSkin("dhx_skyblue");                
mygrid.setImagePath("./codebase/imgs/");       
mygrid.setHeader("Name, Email, Age"); 
grid.init();
grid.setColumnHidden(0,true); //hides the 1st column

Related sample: Hide/Show column

The data from hidden columns can be accessed in a usual way:

var value = grid.cells("row1",0).getValue();
grid.cells("row2",1).setValue(value);

In case of initialization from XML, a column can be hidden as in:

<rows>
    <head>
        <column hidden="true">Dummy</column>     </head>
</rows>

By default, data of hidden columns is included into serialization and can't be controlled by the setSerializableColumns method. Also, the data of hidden columns is available during dataProcessor calls.

Userdata

To add a userdata to the whole grid or some of its rows, use the setUserData method:

//adds userdata to the row with id="row1"
mygrid.setUserData("row1","priority","high");
var userdata = mygrid.getUserData("row1","priority");//-> "high"
 
//adds userdata to the whole grid
mygrid.setUserData("","priority","high");
var userdata = mygrid.getUserData("","priority");//-> "high"

Related sample: Using Grid API Methods

In case of initialization from XML, you can use a special tag - <userdata></userdata>:

<rows>
  <userdata name="somName1">some data</userdata>   //userdata related to the whole grid
    <row id="unique_rowid"> 
      <userdata name="someName1"> some row data </userdata> //userdata related to a row
      <userdata name="someName2"> some row data </userdata>
      <cell>cell content</cell>
      <cell><![CDATA[<font color="red">cell</font> content]]></cell>
    </row>
</rows>

Custom attributes

To add a custom attribute to a row in the grid, use the setRowAttribute method:

mygrid.setRowAttribute("row1","priority","high");
var value = mygrid.getRowAttribute("row1","priority"); //->"high"

To add a custom attribute to a cell in the grid, use the setAttribute method:

mygrid.cells("row1",0).setAttribute("priority","high");
var value = mygrid.cells("row1",0).getAttribute("priority"); //->"high"

In case of initialization from XML, you can use a special tag - <row></row>:

<rows>
    <row id="unique_rowid" priority="high">         <cell some="data">cell content</cell>
    </row>
</rows>

By default, custom attributes are not included into serialization and not available during dataProcessor calls.

In case of initialization from XML you can include a custom attribute into serialization as in:

mygrid.xml.row_attrs.push("priority");  //includes some row attribute into serialization
mygrid.xml.cell_attrs.push("priority"); //includes a cell attribute into serialization