How To Hide Column from the Grid Context Menu
Environment
| Product Version | 2019.3.917 |
| Product | RadGrid for ASP.NET AJAX |
Description
On occasion it is necessary to remove one ore more hide/show Column options available to the user in a RadGrid Header Context Menu. This can be accomplished using a combination of the RadGrid Client-side API and the RadMenu Client-side API.
Solution
Using the following Client Settings on a RadGrid, call the OnHeaderShowingMenu event. Since the Header Context Menu is just a RadMenu Context Menu use the Client-side API to hide the element. In the below example, the column Id will not be visible.
<script type="text/javascript">
function OnHeaderMenuShowing(sender, args) {
var menu = args.get_menu(); // Gets the RadContextMenu object
var radMenuItem = menu.findItemByText("Columns"); // Gets the Columns RadMenuItem Object
var radMenuItemCollection = radMenuItem.get_items(); // Gets the Collection of Items in the Columns Object
// Iterate the Collection
for (var i = 0; i < radMenuItemCollection.get_count(); i++) {
// Do Some Logic to Hide the Item
if (radMenuItemCollection.getItem(i).get_text() === "Id") {
radMenuItemCollection.getItem(i).set_visible(false);
}
}
}
</script>
<telerik:RadGrid ID="RadGrid1" runat="server"
EnableHeaderContextMenu="true"
AutoGenerateColumns="False"
OnNeedDataSource="RadGrid1_NeedDataSource"
OnItemCommand="RadGrid1_ItemCommand">
<ClientSettings AllowColumnHide="true">
<ClientEvents OnHeaderMenuShowing="OnHeaderMenuShowing"/>
</ClientSettings>
<MasterTableView Width="100%">
<Columns>
<telerik:GridBoundColumn HeaderText="Id"
DataField="ProductId" UniqueName="Id">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn HeaderText="Name"
DataField="ProductName">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn HeaderText="Unit Price"
DataField="UnitPrice">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn HeaderText="Quantity Per Unit"
DataField="QuantityPerUnit">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn HeaderText="Units In Stock"
DataField="UnitsInStock">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn HeaderText="Units In Transit"
DataField="UnitsOnOrder">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn HeaderText="Reorder Level"
DataField="ReorderLevel">
</telerik:GridBoundColumn>
</Columns>
</MasterTableView>
</telerik:RadGrid>