Highlight previously selected ContextMenuItem

1 posts, 0 answers
  1. Shinu
    Shinu avatar
    16997 posts
    Member since:
    Mar 2007

    Posted 09 Mar 2011 Link to this post

    Requirements

    RadControls version

     

    2010. 3. 1215. 20
    .NET version

    3.5 SP1
    Visual Studio version

     

    2008+
    programming language

     

    C#, Javascript
    browser support

    all browsers supported by RadControls


    PROJECT DESCRIPTION
    This project demonstrates how to highlight a previously selected ContextMenuItem when it opens next time.

    In order to achieve the functionality, attach OnClientItemClicked event to RadContextMenu and  set the style for the curresponding RadMenuItem based on SelecteIndex value.

    ASPX:
    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="CodeLibrarycontextmenu.aspx.cs"
        Inherits="menu_contextmenu" %>
     
    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <head runat="server">
        <title></title>
    </head>
    <body>
        <form id="form1" runat="server">
        <div>
            <asp:ScriptManager ID="ScriptManager" runat="server">
            </asp:ScriptManager>
            <asp:Button ID="btnFilterName" runat="server" Text="Right Click to Show Menu" />
            <telerik:RadContextMenu ID="RadContextMenuFirstName" runat="server" OnClientItemClicked="highlightItem"
                OnItemClick="RadContextMenuFirstName_ItemClick">
                <Targets>
                    <telerik:ContextMenuControlTarget ControlID="btnFilterName" />
                </Targets>
                <Items>
                    <telerik:RadMenuItem Value="CONTAINS" Text="CONTAINS" />
                    <telerik:RadMenuItem Value="DOESNOTCONTAIN" Text="DOESNOTCONTAIN" />
                    <telerik:RadMenuItem Value="EQUALTO" Text="EQUALTO" />
                    <telerik:RadMenuItem Value="NOTEQUALTO" Text="NOTEQUALTO" />
                    <telerik:RadMenuItem Value="STARTSWITH" Text="STARTSWITH" />
                    <telerik:RadMenuItem Value="ENDSWITH" Text="ENDSWITH" />
                    <telerik:RadMenuItem Value="ISNULL" Text="ISNULL" />
                    <telerik:RadMenuItem Value="NOTISNULL" Text="NOTISNULL" />
                </Items>
            </telerik:RadContextMenu>
            <asp:HiddenField ID="HiddenField1" runat="server" />
            <br />
        </div>
        </form>
    </body>
    </html>

    <script type="text/javascript">

            var index;
            var hiddenField;

            function pageLoad() {
                hiddenField = document.getElementById("HiddenField1");
                if (hiddenField.value != "") {
                    var index = parseInt(hiddenField.value);
                    var menu = $find("<%=RadContextMenuFirstName.ClientID %>");
                    menu.get_items().getItem(index)._element.style.backgroundColor = "Yellow";
                }
            }
            function highlightItem(sender, args) {
                var menu = sender;
                index = args.get_item().get_index();
                for (var i = 0; i < menu.get_items().get_count(); i++) {
                    menu.get_items().getItem(i)._element.style.backgroundColor = "White";
                    if (index == i) {
                        hiddenField.value = i;
                        menu.get_items().getItem(index)._element.style.backgroundColor = "Yellow";

                    }
                }
            }

        </script>


    Thanks,
    Shinu.

Back to Top