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

Two Dependent RadMenus

1 Answer 58 Views
Menu
This is a migrated thread and some comments may be shown as answers.
Bobby
Top achievements
Rank 1
Bobby asked on 01 Sep 2010, 08:26 PM
Hi,

 Is there a working example of how to get the RadMenu to cause an ajax request that occurs when a user mouses over a menu item, pass that item text to the server, then use that name as a key to look up other items to populate another dependent RadMenu? I have tried this using the following code but was unsuccesful.

UserControl.ascx
<div id="CloudDropDown" class="clearfix">
    <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
        <script type="text/javascript">
            function ChangeSubMenu(s, e) {
                $find("<%= RadAjaxManager.GetCurrent(Page).ClientID %>").ajaxRequestWithTarget("<%= mainMenu.UniqueID %>", e.get_selectedItem().get_text()); 
            }
        </script>
   </telerik:RadCodeBlock>
   
       
    <telerik:RadAjaxManagerProxy ID="ajaxManagerProxy" runat="server">
       <AjaxSettings>
           <telerik:AjaxSetting AjaxControlID="mainMenu">
               <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="subMenu" LoadingPanelID="radAjaxLoadingPanel" />
               </UpdatedControls>
           </telerik:AjaxSetting>
       </AjaxSettings>
    </telerik:RadAjaxManagerProxy>
   
    <telerik:RadMenu ID="mainMenu" runat="server" DataSourceID="SitemapDataSource1" Flow="Horizontal" OnClientMouseOver="ChangeSubMenu" MaxDataBindDepth="1" EnableEmbeddedSkins="false" Skin="MedpacRed">
    </telerik:RadMenu>
   
    <telerik:RadMenu ID="subMenu" runat="server" EnableEmbeddedSkins="false" Skin="MedpacRed" Visible="false">
    </telerik:RadMenu>
       
    <asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" ShowStartingNode="false" />
</div>

UserControl.ascx.cs
protected void Page_Load(object sender, EventArgs e)
    {
        RadAjaxManager manager = RadAjaxManager.GetCurrent(Page);
         
        manager.AjaxRequest += new RadAjaxControl.AjaxRequestDelegate(manager_AjaxRequest);
   
           
    }
   
    protected void manager_AjaxRequest(object sender, AjaxRequestEventArgs e)
    {
        Guid rootGui = Utility.FindPageGuid(e.Argument);
        List<SiteNavigationItem> items = Utility.ConvertCmsPages(Utility.FindChildren(e.Argument), rootGui);
   
           
        subMenu.DataSource = items;
        subMenu.DataTextField = "Text";
        subMenu.DataNavigateUrlField = "Url";
        subMenu.DataFieldID = "ID";
        subMenu.DataFieldParentID = "ParentID";
        subMenu.EnableEmbeddedSkins = false;
        subMenu.DataBind();
        subMenu.Visible = true;
    }

Here is my master page that houses my user control.

<%@ Master Language="C#" AutoEventWireup="true" CodeFile="Base.master.cs" Inherits="App_Master_Base" %> 
    
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
    
<head id="Head1" runat="server"
    <title></title
    <asp:ContentPlaceHolder id="head" runat="server"
    </asp:ContentPlaceHolder
</head
<body class="outthere"
    <form id="form1" runat="server"
        <telerik:RadScriptManager ID="scriptManager" runat="server" /> 
        <telerik:RadAjaxManager ID="ajaxManager" runat="server" /> 
        <!-- The skin should be set, else the loading panel is not shown -->
        <telerik:RadAjaxLoadingPanel ID="radAjaxLoadingPanel" runat="server" BackgroundPosition="Center" Skin="Default" /> 
    
        <div id="pageWrapper"
            <div id="page"
                <!-- start header -->
                <div id="header" class="clearfix"
                    <div id="medpacBanner" class="clearfix"
                        <div id="logo"
                            <img id="medpaclog" runat="server" src="~/App_Themes/MedpacRed/images/medpacLogo.gif" /> 
                        </div
                        <div id="menu" class="clearfix"
                            <asp:ContentPlaceHolder ID="contentMenu" runat="server"/> 
                        </div
                        <div id="genericBanner"
                            <img id="Img1" runat="server" src="~/App_Themes/MedpacRed/images/PinTek_MedPak_WebsiteBanner.png" alt="banner" width="1000" /> 
                        </div
                    </div
                </div
                <!-- end header -->
            
                <div id="contentWrapper" class="clearfix"
                    <!-- start content -->
                    <div id="content" class="clearfix"
                        <div id="baseMainContentWrapper"
                            <asp:ContentPlaceHolder ID="baseContent" runat="server"/> 
                        </div
    
                        <!-- start footer -->
                        <div id="footer"
                            <asp:ContentPlaceHolder ID="contentFooter" runat="server"/> 
                        </div
                        <!-- end footer -->
                    </div
                    <!-- end content -->
                </div
            </div
            <!-- end page -->
        </div
    </form
</body
</html>


Can this be accomplished or am I doing something wrong?

Thanks for you help,
Bobby

1 Answer, 1 is accepted

Sort by
0
Yana
Telerik team
answered on 03 Sep 2010, 09:53 AM
Hi Bobby,

Please check the reply in the other forum thread here.

Best wishes,
Yana
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
Tags
Menu
Asked by
Bobby
Top achievements
Rank 1
Answers by
Yana
Telerik team
Share this question
or