DHTMLX Docs & Samples Explorer

Colspan in Grid

You can easily enable colspan mode for any cells in your grid by setting enableCollSpan method to true.

THIS PAGE CONTAINS SAMPLE FUNCTIONALITY OF PROFESSIONAL EDITION FOR DEMONSTRATION PURPOSE ONLY.
UNAUTHORIZED USE IS PROHIBITED. PLEASE CONTACT SALES@DHTMLX.COM TO OBTAIN A LEGAL COPY OF PROFESSIONAL EDITION.
Source
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxgrid.css">
<link rel="stylesheet" type="text/css" href="../../codebase/skins/dhtmlxgrid_dhx_skyblue.css">
<script  src="../../codebase/dhtmlxcommon.js"></script>
<script  src="../../codebase/dhtmlxgrid.js"></script>
<script  src="../../codebase/dhtmlxgridcell.js"></script>
 
 
 
<div id="gridbox" style="width:600px; height:270px; background-color:white;overflow:hidden"></div>
 
<script>
mygrid = new dhtmlXGridObject('gridbox');
mygrid.setImagePath("../../codebase/imgs/");
mygrid.setHeader("Sales,Book Title,Author,Price,In Store,Shipping,Bestseller,Date of Publication");
mygrid.setInitWidths("50,150,120,80,80,80,80,200");
mygrid.setColAlign("center,left,left,right,center,left,center,center");
mygrid.setColTypes("dyn,ed,ed,price,ch,co,ro,ro");
mygrid.getCombo(5).put(2, 2);
mygrid.setColSorting("int,str,str,int,str,str,str,date");
mygrid.enableMultiselect(true);
mygrid.enableCollSpan(true);
mygrid.init();
mygrid.setSkin("dhx_skyblue");
mygrid.loadXML("../common/grid_cp.xml");
</script>