New to Telerik UI for ASP.NET AJAX? Download free 30-day trial

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>

See Also

In this article
Not finding the help you need? Improve this article