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

Recreate menu on click

2 Answers 90 Views

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

Eduardo asked on 03 Jun 2009, 03:09 PM

Hi,

I have a problem here. I don't know if my approach is the best, but I'm using a menu as breadcrumbs because I need each breadcrumb to have a menu. I am implementing the easy way and recreating in javascript all the items and menus of the breadbrumbs. In my case there is no performance issues as at most there will be only 4 layers and not many menu items on each layer.

However, I'm now facing a problem. When someone clicks one of the items in the breadcrumbs menu, I clear all items in the menu and recreate it to reflect the new navigation content. Everything seems to work fine, until I get a javascript error on the Telerik code when I try to hover the new menu item. It happens when it tries to run some code to update the zIndex of the control, however the control items are not there anymore, my routine already removed and recreated with other items.

Is there a way to accomplish that? Recreating the whole menu is much easier than checking where it was clicked and only update the items needed :)

Here it is a testing code I am using (the real code is much, much bigger):

    
            <html xmlns="http://www.w3.org/1999/xhtml" > 
        
            <head runat="server"> 
        
                <title></title> 
        
                <telerik:radcodeblock ID="RadCodeBlock1" runat="server"> 
        
                    <script type="text/javascript"> 
        
                        function onClicking(sender, eventArgs) { 
        
                            var BreadCrumbs = $find("<%= RadMenu1.ClientID %>"); 
        
                            var item = eventArgs.get_item(); 
        
                            var name = item.get_text(); 
        
                            BreadCrumbs.get_items().clear(); 
        
                            var childItem = new Telerik.Web.UI.RadMenuItem(); 
        
                            childItem.set_text(name); 
        
                            for (var i = 0; i < 3; i++) { 
        
                                var menuItem = new Telerik.Web.UI.RadMenuItem(); 
        
                                menuItem.set_text("Test " + i); 
        
                                childItem.get_items().add(menuItem); 
        
                            } 
        
                            BreadCrumbs.get_items().add(childItem); 
        
                        } 
        
                    </script> 
        
                </telerik:radcodeblock> 
        
            </head> 
        
            <body> 
        
                <form id="form1" runat="server"> 
        
                <telerik:RadScriptManager ID="RadScriptManager1" runat="server"> 
        
                </telerik:RadScriptManager> 
        
                <div> 
        
                    <telerik:RadMenu ID="RadMenu1" runat="server" 
        
                            OnClientItemClicking="onClicking"> 
        
                        <Items> 
        
                            <telerik:RadMenuItem runat="server" Text="Root"> 
        
                                <Items> 
        
                                    <telerik:RadMenuItem runat="server" Text="Test 1"> 
        
                                    </telerik:RadMenuItem> 
        
                                    <telerik:RadMenuItem runat="server" Text="Test 2"> 
        
                                    </telerik:RadMenuItem> 
        
                                    <telerik:RadMenuItem runat="server" Text="Test 3"> 
        
                                    </telerik:RadMenuItem> 
        
                                </Items> 
        
                            </telerik:RadMenuItem> 
        
                        </Items> 
        
                    </telerik:RadMenu> 
        
                </div> 
        
                </form> 
        
            </body> 
        
            </html>

Thanks,
Eduardo

2 Answers, 1 is accepted

Accepted

answered on 08 Jun 2009, 03:53 PM

Hello Eduardo,

Thank you for reporting this problem. The menu keeps a reference to the currently open item and calls close() for it when it's no longer part of the menu. We've fixed this bug and the fix will be available in the internal build tomorrow (version 2009.1.608 and up). A temporary solution is to call close() before calling clear():

// ...
BreadCrumbs.close();
BreadCrumbs.get_items().clear();
// ...

I hope this helps. As a token of our gratitude for your involvement, your Telerik points have been updated.

All the best,
Tsvetomir Tsonev
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

Product Bundles

DevCraft

Web

Mobile

Document Management

Desktop

Reporting & Mocking

Automated Testing

CMS

UI/UX Tools

Debugging

Free Tools

Support and Learning

Productivity and Design Tools

Recreate menu on click

2 Answers, 1 is accepted