Start Building Professional
Web Apps Today

Context Menu in Grid

Hi Team,

I'm trying to create a context menu within my grid with data like example below:

Column1 Menu Action
A Edit,Delete
B Approve,Reject,Edit,Delete
C Edit,Delete

for each row i need to create a dynamic menu item based on each row's data variable.Is that possible to do that?

Thanks in advance.

dian

You can't attach mutliple menus to the grid, but you can attach menu with all possible items, and show|hide necessary ones before it will be shown. 
grid.attachEvent("onBeforeContextMenu",function(id){
  // id  - id of row for which context menu called
  some_code_to_adjust_menu_content_here();
  return true;
});

well i was trying to add some code in BeforeContextMenu events to reload the context menu XML based on the specific row data.
The menu results is ok but the problem is the appeareance of the context menu is not how it supposed to be.
The menu pop up is not in the grid's row but at the top left corner of the page. Do you have any suggestion for this?

Thanks in advance.

Dian

>>to reload the context menu XML based on the specific row data.
reloading is async. process, so it will take time and will look ugly, the better approach is to have all necessary items in menu and just calls

contMenu.menu.showItems();//show all
contMenu.menu.hideItems("a1,a3,a5"); //list of items not necessary for current grid row

>>The menu pop up is not in the grid's row but at the top left corner of the page. 
This is result of XML loading, it correct position based on parameters from XML.
The best way is too use single-load approach, described above. 
or
You can update to dhtmlxMenu 2.0 ( just release ) which has not such problem with loading from XML

Hi Team,

I just updated with version 2 dhtmlxmenu and combine it with dhtmlxGrid_v20_pro_81009. I'm still trying to do the dynamic menu based on each row data.
well the appereance problem is not occur anymore as i mentioned before with version 1. but the logic is not working. I tried to do this code below:

conMenu = new dhtmlXMenuObject();
conMenu.setImagePath("../codebase/imgs/");
conMenu.renderAsContextMenu();           
conMenu.attachEvent("onClick",onButtonClick);      
conMenu.loadXML("test.php");

.....

grid.enableContextMenu(conMenu);
grid.init();
grid.attachEvent("onBeforeContextMenu",my_pre_func);



function my_pre_func(rowId, celInd, grid)
    {    
        if (celInd == 10)
      {             
                conMenu.loadXML("test.php?id=" + rowId);               
            return true;
      }
        return false;
    }

Unfortunately the context menu items is not change even though if i do separate test of the server side code using the rowId param works fine.
It seems that the context menu cannot reload the new xml result. Is there any suggestions because i really need to do dynamic menu from server side instead of single-load approach using java script.

Thanks in advance.

dian

Menu / ContextMenu loads data from XML just one time. In case of Dynamical loading data loaded for items which have not loaded subitems.
So you can't fully reload menu with XML. But you can do it with script showing / hiding corresponding items.