This is a migrated thread and some comments may be shown as answers.

Get Menu Text Selected Client Side

3 Answers 118 Views
Menu
This is a migrated thread and some comments may be shown as answers.
Jerry Jansen
Top achievements
Rank 1
Jerry Jansen asked on 11 Dec 2014, 09:42 PM
How do I get the menu text of the menu item selected with client side code?

Thanks

3 Answers, 1 is accepted

Sort by
0
Aneliya Petkova
Telerik team
answered on 12 Dec 2014, 08:53 AM
Hi Jerry,

You can use the OnClientItemClicked or OnClientItemFocus events. Please try the following example:
<head runat="server">
    <title></title>
    <style>
        .eventLog {
            display: block;
            position: relative;
            float: right;
            right: 300px;
            width: 300px;
            height:300px;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <asp:ScriptManager ID="ScriptManager1" runat="server">
            </asp:ScriptManager>
            <telerik:RadMenu ID="RadMenu1" runat="server" Style="left: 100px; top: 2px" OnClientItemFocus="onItemFocus">
                <Items>
                    <telerik:RadMenuItem runat="server" Text="Root RadMenuItem 1">
                        <Items>
                            <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 1">
                            </telerik:RadMenuItem>
                            <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 2">
                                <Items>
                                    <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 1">
                                    </telerik:RadMenuItem>
                                    <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 2">
                                    </telerik:RadMenuItem>
                                    <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 3">
                                    </telerik:RadMenuItem>
                                </Items>
                            </telerik:RadMenuItem>
                            <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 3" Enabled="false">
                            </telerik:RadMenuItem>
                        </Items>
                    </telerik:RadMenuItem>
                    <telerik:RadMenuItem runat="server" Text="Root RadMenuItem 2">
                    </telerik:RadMenuItem>
                    <telerik:RadMenuItem runat="server" Text="Root RadMenuItem 3" Enabled="false">
                        <Items>
                            <telerik:RadMenuItem runat="server" Text="Root RadMenuItem 2">
                            </telerik:RadMenuItem>
                        </Items>
                    </telerik:RadMenuItem>
                </Items>
            </telerik:RadMenu>
        </div>
        <script type="text/javascript">
            function onItemFocus(sender, eventArgs) {
                var item = eventArgs.get_item();
                logEvent("Item " + item.get_text());
            }
 
            function logEvent(text) {
                var log = $get("EventLog");
 
                log.value += text + "\n";
                log.scrollTop = log.scrollHeight;
            }
        </script>
        <textarea id="EventLog" class="eventLog"></textarea>
    </form>
</body>


Regards,
Aneliya Petkova
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
0
Jerry Jansen
Top achievements
Rank 1
answered on 15 Dec 2014, 06:51 PM
Thanks Aneliya that worked for me.

I have another question. I have the RadMenu inside of a RadAjaxPanel. When the RadMenu is in Mobile render mode and the menu is clicked on (expanded) and then click on a menu item, the expanded menu does not collapse back to the mobile icon. Is there a way in the client code javascript to force the RadMenu to collapse in mobile mode?
0
Aneliya Petkova
Telerik team
answered on 16 Dec 2014, 11:47 AM
Hi Jerry,

Regarding your other question about mobile RadMenu - you can use the OnClientItemClicked event in order to collapse the menu when you click on a RadMenuItem. Please use the following code:
function clicked(sender, eventArgs) {
    var rootToggleElement = sender._getRootToggleElement();
    $telerik.$(rootToggleElement).click();
}

Hope this will be helpful.

Regards,
Aneliya Petkova
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
Tags
Menu
Asked by
Jerry Jansen
Top achievements
Rank 1
Answers by
Aneliya Petkova
Telerik team
Jerry Jansen
Top achievements
Rank 1
Share this question
or