DHTMLX Docs & Samples Explorer

Context menu

There is an opportunity which allows you to set color for any row in the grid. Click right button on any row and select proper color in the context menu.



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">   
<link rel="stylesheet" type="text/css" href="../../../dhtmlxMenu/codebase/skins/dhtmlxmenu_dhx_skyblue.css">
<script  src="../../codebase/dhtmlxcommon.js"></script>
<script  src="../../codebase/dhtmlxgrid.js"></script>
<script  src="../../codebase/dhtmlxgridcell.js"></script>
<script  src="../../codebase/excells/dhtmlxgrid_excell_link.js"></script>
<script language="JavaScript" src="../../../dhtmlxMenu/codebase/dhtmlxmenu.js"></script>
 
 
 
<table width="100%">
    <tr>
        <td>
            <div id="gridbox" style="width:100%;height:270px;background-color:white;"></div>
        </td>
    </tr>
</table>
<br>
<br>
<script>
function onButtonClick(menuitemId, type) {
    var data = mygrid.contextID.split("_");
    //rowId_colInd;
    mygrid.setRowTextStyle(data[0], "color:" + menuitemId.split("_")[1]);
    return true;
}
menu = new dhtmlXMenuObject();
menu.setIconsPath("../common/images/");
menu.renderAsContextMenu();
menu.attachEvent("onClick", onButtonClick);
menu.loadXML("../common/_context.xml");
mygrid = new dhtmlXGridObject('gridbox');
mygrid.setImagePath("../../codebase/imgs/");
mygrid.setHeader("Author,Title");
mygrid.setInitWidths("250,250");
mygrid.enableAutoWidth(true);
mygrid.setColAlign("left,left");
mygrid.setColTypes("ro,link");
mygrid.setColSorting("str,str");
mygrid.enableContextMenu(menu);
mygrid.init();
mygrid.setSkin("dhx_skyblue");
mygrid.loadXML("../common/grid_links.xml");
</script>