Open menu with JavaScript

4 posts, 1 answers
  1. Niclas
    Niclas avatar
    9 posts
    Member since:
    Oct 2008

    Posted 26 Nov 2008 Link to this post

    I am trying to open a menu from the onClick event of a A-link.

    I use this function

    function

    openRadMenu(menuId)

     

    {

     

     

    var oRadMenu = $find(menuId);

     

     

    oRadMenu.get_items().getItem(0).click();

     

    }

    The menu opens but it is closed again at once. It does not stay open.

    The menu looks like this:

     

     

    </a>

     

     

     

     

     

    <telerik:RadMenu ClickToOpen ="true" ID="RadMenu1" runat="server" Skin="Office2007" EnableEmbeddedSkins ="true" >

     

     

     

     

     

    <CollapseAnimation Type="OutQuint" Duration="200"></CollapseAnimation>

     

     

     

     

     

    <Items>

     

     

     

     

     

     

    <telerik:RadMenuItem text="Apa">

     

     

     

     

     

     

    <Items>

     

     

     

     

     

    <telerik:RadMenuItem Text="Mission Statement">

     

     

     

     

     

    </telerik:RadMenuItem>

     

     

     

     

     

    <telerik:RadMenuItem Text="Strategic Plan">

     

     

     

     

     

    </telerik:RadMenuItem>

     

     

     

     

    </Items>

     

     

     

     

     

    </telerik:RadMenuItem>

     

     

     

     

     

    </Items>

     

     

    </telerik:RadMenu>

    I have also tried with oRadMenu.get_items().getItem(0).click();

     

  2.
  3. Paul
    Admin
    Paul avatar
    4281 posts

    Posted 26 Nov 2008 Link to this post

    Hello Niclas,

    In order to achieve your goal you should use the open() method. Please refer to our Client-Side API example for details on how to achieve your goal.

    Greetings,
    Paul
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  5. Niclas
    Niclas avatar
    9 posts
    Member since:
    Oct 2008

    Posted 27 Nov 2008 Link to this post

    I have tried that as well but the menu is still closed at once. But if i set the property ClickToOpen to false the menu stays open. But that is not the behavior i want. Try it yourself, I try to open the menu like this:

    <

    a href ="#" onclick="openRadMenu('<%=radmenu1.clientid %>');">AA</a>

     

    function

    openRadMenu(menuId)

     

    {

     

    var oRadMenu = $find(menuId);

     

    oRadMenu.get_items().getItem(0).open();

    }

  7. Answer
    Paul
    Admin
    Paul avatar
    4281 posts

    Posted 27 Nov 2008 Link to this post

    Hi Niclas,

    Please find below a sample code snippet that shows the needed approach.

    <form id="form1" runat="server">  
        <telerik:RadScriptManager ID="RadScriptManager1" runat="server">  
        </telerik:RadScriptManager> 
     
        <script type="text/javascript">  
        function openRadMenu(e)  
        {  
            var oRadMenu = $find('<%= RadMenu1.ClientID %>');     
            window.setTimeout(  
                function()  
                {  
                    oRadMenu.get_items().getItem(0).open();  
                }  
                , 0);  
        }  
        </script> 
     
        <telerik:RadMenu ID="RadMenu1" ClickToOpen="true" runat="server" Skin="Office2007" EnableEmbeddedSkins="true">  
            <CollapseAnimation Type="OutQuint" Duration="200"></CollapseAnimation> 
            <Items> 
                <telerik:RadMenuItem Text="Apa">  
                    <Items> 
                        <telerik:RadMenuItem Text="Mission Statement">  
                        </telerik:RadMenuItem> 
                        <telerik:RadMenuItem Text="Strategic Plan">  
                        </telerik:RadMenuItem> 
                    </Items> 
                </telerik:RadMenuItem> 
            </Items> 
        </telerik:RadMenu> 
        <a href ="#" onclick="openRadMenu();">AA</a> 
    </form> 


    Regards,
    Paul
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  8.
Back to Top