Telerik Forums / UI for ASP.NET AJAX Forum / Menu /

Two Dependent RadMenus

Telerik UI for ASP.NET AJAX
Resources Buy Try

2 posts, 0 answers

Bobby

1 posts

Member since:
Feb 2009

Posted 01 Sep 2010 Link to this post

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">



<html xmlns="http://www.w3.org/1999/xhtml">

<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" />

        

        <telerik:RadAjaxLoadingPanel ID="radAjaxLoadingPanel" runat="server" BackgroundPosition="Center" Skin="Default" />



        <div id="pageWrapper">

            <div id="page">

                

                <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>

                



                <div id="contentWrapper" class="clearfix">

                    

                    <div id="content" class="clearfix">

                        <div id="baseMainContentWrapper">

                            <asp:ContentPlaceHolder ID="baseContent" runat="server"/>

                        </div>



                        

                        <div id="footer">

                            <asp:ContentPlaceHolder ID="contentFooter" runat="server"/>

                        </div>

                        

                    </div>

                    

                </div>

            </div>

            

        </div>

    </form>

</body>

</html>

Can this be accomplished or am I doing something wrong?

Thanks for you help,
Bobby
Yana
Admin

5030 posts

Posted 03 Sep 2010 Link to this post

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

Two Dependent RadMenus

Bobby

Yana