add different custom contextmenuitems in columnheader and datarow

[Sietse Wielenga]

In the contextmenu I want show some custom contextmenuitems, but the custom contextmenuitems in columnheader and datarow should be different (in columnheader "options" and in datarow "info") .

How can I do this?

[Farveen Sulthana Thameeztheen Basha]

Hi Sietse, 

Thanks for contacting Syncfusion Support. 

We have analyzed your query and we have achieved your requirement using “contextOpen” event of the Grid. In the contextOpen event of the Grid, based on args.target we have hide and show the context menu. When the target contains e-headercelldiv we have hide the info and when it is e-rowcell we have hide the Options context menu. 

Please refer to the code example:- 

<script type="text/javascript"> 

    $(function () { 

        $("#Grid").ejGrid({ 

            // the datasource "window.gridData" is referred from jsondata.min.js 

            dataSource: window.gridData, 

            allowPaging: true, 

            contextOpen: function (args) { 

                if ($(args.target).hasClass("e-headercelldiv")) { 

                    $("#Grid_Context").find("#Info").hide(); 

                    $("#Grid_Context").find("#Options").show(); 

                } 

                else if ($(args.target).hasClass("e-rowcell")) { 

                    $("#Grid_Context").find("#Options").hide(); 

                    $("#Grid_Context").find("#Info").show(); 

                } 

            }, 

 

             contextMenuSettings: { enableContextMenu: true, contextMenuItems: [], customContextMenuItems: [{ id: 'Options', text: "Options" }, { id: 'Info', text: "Info" }] }, 

             

    }); 

</script> 

Please refer to the sample Link:- 

https://jsplayground.syncfusion.com/fcetasgv 

Refer to the API link:- 

https://help.syncfusion.com/api/js/ejgrid#events:contextopen 

Please get back to us if you need any further assistance. 

Regards, 

Farveen sulthana T