The mentioned functionality requires PRO version of the dhtmlxGrid package
To create a context menu in the grid, use the technique as in:
<link type="text/css" href="../codebase/dhtmlx.css">
<script src="../codebase/dhtmlx.js"></script>
<script> // Create a function for processing menu commands
function onButtonClick(menuitemId){
// Get array the 1st element of which is the row id, the 2nd - the cell index
var data = myGrid.contextID.split("_"); // rowId_colInd
// Use input data to perform any action you need
myGrid.setRowTextStyle(data[0],"background-color:"+menuitemId.split("_")[1]);
};
// Create a menu
myMenu = new dhtmlXMenuObject();
myMenu.setIconsPath("../common/images/");
myMenu.renderAsContextMenu();
myMenu.attachEvent("onClick",onButtonClick);
myMenu.loadStruct("../common/_context.xml");
// Initialize the grid and attach the menu to it
myGrid = new dhtmlXGridObject('gridbox');
myGrid.setSkin("dhx_skyblue");
myGrid.setImagePath("../codebase/imgs/");
myGrid.setHeader("Name, Email, Age");
myGrid.enableContextMenu(myMenu);
myGrid.init();
</script>
The mygrid.contextID is a complex string consisting of the row id and the column index delimited with "_".
dhtmlxGrid supports the onBeforeContextMenu event that allows you to provide a custom behaviour for the context menu:
function my_pre_func(rowId,celInd,grid){
if (celInd==1) return false;
return true;
};
myGrid.attachEvent("onBeforeContextMenu", my_pre_func);
Related sample: Context menu for specific column
Back to top