We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

How can I enable or disable a menu option that is inside a template in ASP.NET MVC Grid?

Hello, I am configuring a grid with menus within templates for each record and I would like to enable or disable options depending on the values in each record. I am using the answer they gave to another user to create the menu inside a template (Thread ID:149122 / https://www.syncfusion.com/forums/149327/how-i-add-a-menu-in-the-grid-toolbar ), but when using menuObj.enableItems (), the grid does not show records, although it does. I hope you can help me. First of all, Thanks

1 Reply

AG Ajith Govarthan Syncfusion Team May 7, 2020 05:08 AM

Hi Juan, 

Greetings from Syncfusion. 

Based on your requirement we have prepared sample in that we have rendered EJ2 Menu component as column template. In the menu Component we have used beforeOpen event in that we have disabled the options of the Menu component based on the rowData of the corresponding row using the enableItems method. We have attached the sample so please refer the sample for your reference. 

Code Snippet:  
Index.cshtml 

<script type="text/javascript"> 
function template(args) { 
if (args.column.headerText === "Inupt1") { 
var ele = args.cell.querySelector('.list'); 
var menuItems = [ 
{ 
text: 'Events', 
items: [ 
{ text: 'Conferences' }, 
{ text: 'Music' }, 
{ text: 'Workshops' } 
] 
}, 
]; 
var menuComp = new ej.navigations.Menu({ 
items: menuItems, beforeOpen: function (args) { 
//Handling sub menu items 
var grid = document.getElementsByClassName('e-grid')[0].ej2_instances[0]; 
var row = new ej.grids.parentsUntil(args.event.target, 'e-row', false); 
var rowDetails = grid.getRowInfo(new ej.grids.parentsUntil(args.event.target, 'e-row', false)); 
if (row && rowDetails.rowData.OrderID > 10001 && rowDetails.rowData.OrderID < 10005) { 
for (var i = 0; i < args.items.length; i++) { 
if (disableItems.indexOf(args.items[i].text) > -1) { 
menuComp.enableItems([args.items[i].text], false, false); 
} 
} 
} 
}}); 
menuComp.appendTo(ele); 
var disableItems = ['Music', 'Workshops']; 
} 
} 
</script> 



Regards, 
Ajith G 


Loader.
Live Chat Icon For mobile
Up arrow icon