Thursday, June 28, 2012

Displaying a context menu for Column Headers of an AspxGridView


It is possible we can create context menu on aspxgridview. Find the following example for aspxgridview context menu.


Default.aspx:
=============

<dx:ASPxGridView ID="grvContexMenuExample" runat="server" AutoGenerateColumns="false"
    KeyFieldName="ID" EnableViewState="true" ClientInstanceName="grdtest" Width="100%"
    Settings-GridLines="None" OnHtmlRowPrepared="grvContexMenuExample_HtmlRowPrepared">
    <ClientSideEvents ContextMenu="function(s,e) {
                                                       if(e.objectType == 'header')
                                                        {
                                                               headerContextMenu.ShowAtPos(e.htmlEvent.clientX, e.htmlEvent.clientY);
                                                         }
                                                         else if(e.objectType == 'row')
                                                         {
                                                             headerContextMenu.ShowAtPos(e.htmlEvent.clientX, e.htmlEvent.clientY);
                                                         }
                                                    }" />
    <Columns>

    <%--Your columns goes here--%>
        <columns>
</dx:ASPxGridView>

<!--Start New  Context Menu !-->
<dx:ASPxPopupMenu ID="mnContextMenu" runat="server" ClientInstanceName="headerContextMenu"
    EnableAnimation="false" PopupHorizontalAlign="OutsideRight" PopupVerticalAlign="TopSides"
    PopupAction="RightMouseClick">
    <Items>
        <dx:MenuItem Text="New Context Menu1">
        </dx:MenuItem>
    </Items>
    <ClientSideEvents ItemClick="ContextMenuItemClick" />
</dx:ASPxPopupMenu>
<!--End New   Context Menu !-->






Default.aspx.cs:
================

  protected void grvContexMenuExample_HtmlRowPrepared(object sender, ASPxGridViewTableRowEventArgs e)
        {


            if (e.RowType == GridViewRowType.Data)

                if (e.RowType == GridViewRowType.Header)
                {

                    e.Row.Attributes.Remove("oncontextmenu");
                }


        }

2 comments:

  1. Hi, Great.. Tutorial is just awesome..It is really helpful for a newbie like me.. I am a regular follower of your blog. Really very informative post you shared here. Kindly keep blogging. If anyone wants to become a .Net developer learn from Dot Net Training in Chennai. or learn thru ASP.NET Essential Training Online . Nowadays Dot Net has tons of job opportunities on various vertical industry.
    or Javascript Training in Chennai. Nowadays JavaScript has tons of job opportunities on various vertical industry.

    ReplyDelete