Telerik is a leading vendor of ASP.NET AJAX, ASP.NET MVC, Silverlight, WinForms and WPF controls and components, as well as .NET Reporting, .NET ORM , .NET CMS, Code Analysis, Mocking, Team Productivity and Automated Testing Tools. Building on its expertise in interface development and Microsoft technologies, Telerik helps customers build applications with unparalleled richness, responsiveness and interactivity. Telerik products help thousands of companies to be more productive and deliver reliable applications under budget and on time.
Version Q1 2012 released 04/11/2012
select

Grid / Header Context Filter Menu

OrderIDShipNameOrderDateShippedDateShipCountry
Ship city Show context menu
ShipPostalCodeFreight
       Sum : 64942.69
12345678910...
Page size:
select
 830 items in 56 pages
10248Vins et alcools Chevalier7/4/1996Tuesday, July 16, 1996France Reims 5110032.38
10249Toms Spezialitäten7/5/1996Wednesday, July 10, 1996Germany Münster 4408711.61
10250Hanari Carnes7/8/1996Friday, July 12, 1996Brazil Rio de Janeiro 05454-87665.83
10251Victuailles en stock7/8/1996Monday, July 15, 1996France Lyon 6900441.34
10252Suprêmes délices7/9/1996Thursday, July 11, 1996Belgium Charleroi B-600051.30
10253Hanari Carnes7/10/1996Tuesday, July 16, 1996Brazil Rio de Janeiro 05454-87658.17
10254Chop-suey Chinese7/11/1996Tuesday, July 23, 1996Switzerland Bern 301222.98
10255Richter Supermarkt7/12/1996Monday, July 15, 1996Switzerland Genève 1204148.33
10256Wellington Importadora7/15/1996Wednesday, July 17, 1996Brazil Resende 08737-36313.97
10257HILARION-Abastos7/16/1996Monday, July 22, 1996Venezuela San Cristóbal 502281.91
10258Ernst Handel7/17/1996Tuesday, July 23, 1996Austria Graz 8010140.51
10259Centro comercial Moctezuma7/18/1996Thursday, July 25, 1996Mexico México D.F. 050223.25
10260Ottilies Käseladen7/19/1996Monday, July 29, 1996Germany Köln 5073955.09
10261Que Delícia7/19/1996Tuesday, July 30, 1996Brazil Rio de Janeiro 02389-6733.05
10262Rattlesnake Canyon Grocery7/22/1996Thursday, July 25, 1996USA Albuquerque 8711048.29

Click "PostBack" to see the state of the grid is preserved.

  • RadGrid's header context menu can be shown either:
    • on mouse right-click over a header cell
    • or by left-clicking on an element that fires a client-side method of RadGrid's, showing the context menu (see the ShipCity template column)

Source Code

C# VB.NET
Show code in new window Demo isolation steps
  • <%@ Page Language="vb" AutoEventWireup="false" CodeFile="DefaultVB.aspx.vb" Inherits="Telerik.GridExamplesCSharp.GeneralFeatures.Filtering.DefaultVB" %>

    <%@ Register TagPrefix="telerik" Namespace="Telerik.QuickStart" %>
    <%@ Register TagPrefix="telerik" TagName="Header" Src="~/Common/Header.ascx" %>
    <%@ Register TagPrefix="telerik" TagName="HeadTag" Src="~/Common/HeadTag.ascx" %>
    <%@ Register TagPrefix="telerik" TagName="Footer" Src="~/Common/Footer.ascx" %>
    <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <telerik:HeadTag runat="server" ID="Headtag2"></telerik:HeadTag>
    </head>
    <body class="BODY">
        <form id="mainForm" method="post" runat="server">
        <telerik:Header ID="Header1" runat="server" NavigationLanguage="VB"></telerik:Header>
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <!-- content start -->
        <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
            <script type="text/javascript">
            <!--
                function ShowColumnHeaderMenu(ev, columnName)
                {
                    var grid = $find("<%=RadGrid1.ClientID %>");
                    var columns = grid.get_masterTableView().get_columns();

                    for (var i = 0; i < columns.length; i++)
                    {
                        if (columns[i].get_uniqueName() == columnName)
                        {
                            columns[i].showHeaderMenu(ev, 75, 20);
                        }
                    }
                }
                -->
            </script>
        </telerik:RadCodeBlock>
        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="RadGrid1">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="RadGrid1" LoadingPanelID="RadAjaxLoadingPanel1" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
            </AjaxSettings>
        </telerik:RadAjaxManager>
        <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" />
        <telerik:RadGrid AutoGenerateColumns="false" ID="RadGrid1" DataSourceID="SqlDataSource1"
            Width="760px" AllowFilteringByColumn="True" AllowSorting="True" PageSize="15"
            ShowFooter="True" AllowPaging="True" runat="server" GridLines="None" EnableLinqExpressions="false"
            EnableHeaderContextMenu="true" EnableHeaderContextFilterMenu="true">
            <PagerStyle Mode="NextPrevAndNumeric" />
            <GroupingSettings CaseSensitive="false" />
            <MasterTableView AutoGenerateColumns="false" IsFilterItemExpanded="false" EditMode="InPlace"
                AllowFilteringByColumn="True" ShowFooter="True" TableLayout="Auto">
                <Columns>
                    <telerik:GridNumericColumn DataField="OrderID" HeaderText="OrderID" SortExpression="OrderID"
                        UniqueName="OrderID">
                    </telerik:GridNumericColumn>
                    <telerik:GridBoundColumn DataField="ShipName" HeaderText="ShipName" SortExpression="ShipName"
                        UniqueName="ShipName">
                    </telerik:GridBoundColumn>
                    <telerik:GridDateTimeColumn DataField="OrderDate" HeaderText="OrderDate" SortExpression="OrderDate"
                        UniqueName="OrderDate" PickerType="None" DataFormatString="{0:d}">
                    </telerik:GridDateTimeColumn>
                    <telerik:GridDateTimeColumn DataField="ShippedDate" HeaderText="ShippedDate" SortExpression="ShippedDate"
                        UniqueName="ShippedDate" PickerType="DatePicker" DataFormatString="{0:D}">
                        <HeaderStyle Width="160px" />
                    </telerik:GridDateTimeColumn>
                    <telerik:GridBoundColumn DataField="ShipCountry" HeaderText="ShipCountry" SortExpression="ShipCountry"
                        UniqueName="ShipCountry">
                    </telerik:GridBoundColumn>
                    <telerik:GridTemplateColumn DataField="ShipCity" GroupByExpression="ShipCity Group by ShipCity"
                        UniqueName="ShipCity" InitializeTemplatesFirst="false" HeaderStyle-Width="100"
                        HeaderText="Ship city">
                        <HeaderTemplate>
                            <table>
                                <tr>
                                    <td>
    <asp:LinkButton ID="lnkSort" runat="server" CommandArgument="ShipCity" CommandName="Sort"
    Text="Ship city"></asp:LinkButton>
                                    </td>
                                    <td>
                                        <img src="Img/Menu.gif" style="margin-top: 5px; margin-left: 5px; cursor: pointer"
                                            onclick='ShowColumnHeaderMenu(event,"ShipCity")' alt="Show context menu" />
                                    </td>
                                </tr>
                            </table>
                        </HeaderTemplate>
                        <ItemTemplate>
                            <asp:Label ID="lblCity" runat="server" Text='<%#Eval("ShipCity") %>'></asp:Label>
                        </ItemTemplate>
                    </telerik:GridTemplateColumn>
                    <telerik:GridMaskedColumn DataField="ShipPostalCode" HeaderText="ShipPostalCode"
                        SortExpression="ShipPostalCode" UniqueName="ShipPostalCode" Mask="#####">
                        <FooterStyle Font-Bold="true" />
                    </telerik:GridMaskedColumn>
                    <telerik:GridNumericColumn DataField="Freight" DataType="System.Decimal" HeaderText="Freight"
                        SortExpression="Freight" UniqueName="Freight" Aggregate="Sum">
                        <FooterStyle Font-Bold="true" />
                    </telerik:GridNumericColumn>
                </Columns>
            </MasterTableView>
            <ClientSettings>
                <Scrolling AllowScroll="false" />
            </ClientSettings>
        </telerik:RadGrid>
        <br />
        <asp:Button Text="PostBack" runat="server" ID="Button1" CssClass="button" Style="margin: 0 20px 0;" />
        Click "PostBack" to see the state of the grid is preserved.
        <asp:SqlDataSource ID="SqlDataSource1" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
            ProviderName="System.Data.SqlClient" SelectCommand="SELECT * FROM Orders" runat="server">
        </asp:SqlDataSource>
        <!-- content end -->
        <telerik:Footer ID="Footer1" runat="server"></telerik:Footer>
        </form>
    </body>
    </html>

Get more than expected!

Take your time to truly experience the power of RadControls for ASP.NET AJAX with a free 60-day trial backed up by Telerik’s unlimited dedicated support.

Download your RadControls for ASP.NET AJAX trial and jumpstart your development with the available Getting Started resources.

If you have any questions, do not hesitate to contact us at sales@telerik.com.

Copyright 2002-2012 © Telerik. All right reserved
Telerik Inc, 201 Jones Rd, Waltham, MA 02451