wide and powerful client side api
navigation with keyboard
Dynamical loading
Data buffering
90% compatibility with DHTMLX's jTreeTable api (grid part)
fully customizable appearance
XML support
12 predefined Cell Editors (eXcell)
ability to create your own Cell-Editors (eXcell)
three types of data sorting (date,string,int)
column resizing
horizontal & vertical scrolling
single/multi-line rows
single/multi row selection
on/off header
New in version 1.5
Rowspan
Grouping
Subrows
Nested Grids
Built-in Filtering
Built-in Searching
Autocalculated values
Supported browsers
IE 5.5 and above
Mozilla 1.4 and above
FireFox 0.9 and above
Safari 1.3 and above
Working with dhtmlXGrid
Navigation with keyboard
For keyboard navigation you can use following keys:
Tab - change to the next cell in row
Shift+Tab - change to the previous cell in row
Up, Down arrows - change to previous/next row
Enter - if in edit cell mode - close cell
Space - on checkbox or radiobutton - change state
F2 - edit cell
Esc - finish editing
Initialize object on page
<link rel="STYLESHEET" type="text/css" href="../codebase/dhtmlxgrid.css">
<script src="../codebase/dhtmlxcommon.js"></script>
<script src="../codebase/dhtmlxgrid.js"></script>
<script src="../codebase/dhtmlxgridcell.js"></script>
<div id="gridbox" style="width:200;height:200"></div>
<script>
mygrid = new dhtmlXGridObject('gridbox');
// or
//mygrid = new dhtmlXGridObject();
//mygrid.attachToObject(document.body)
mygrid.imgURL = "img/";
mygrid.setHeader("Column A, Column B");
mygrid.setInitWidths("100,250")
mygrid.setColAlign("right,left")
mygrid.setColTypes("ro,ed");
mygrid.setColSorting("int,str")
mygrid.init();
mygrid.loadXML("grid.xml");
</script>