Close radmenu item on click

10 posts, 0 answers
  1. L.K. T.
    L.K. T. avatar
    2 posts
    Member since:
    Jul 2009

    Posted 07 Dec 2009 Link to this post

    Hi,

    I have a radmenu with items that target a iframe inside the page. I like the menu to close immediately after it has been clicked. How can i do that? I think this should be a feature of the menu itself. But it seems it's not possible to do this easily without a lot of javascripts. Can you please show me how to do this?

    Thanks in advance.
  2. Schlurk
    Schlurk avatar
    812 posts
    Member since:
    May 2009

    Posted 07 Dec 2009 Link to this post

    If you subscribe to OnClientItemClickedand use the following javascript I think it'll work:

                function onClicked(sender, eventArgs) { 
                    var menu = $find("<%= RadMenu1.ClientID %>"); 
                    menu.close(); 
                }  

  3. L.K. T.
    L.K. T. avatar
    2 posts
    Member since:
    Jul 2009

    Posted 08 Dec 2009 Link to this post

    function  RadMenuCloseOnClicked(sender, args)   
    {  
    sender.close();  
    }  
     
     

     


    I have registered the OnClientItemClicked of the menu to the javascript function. It seems to achieve what i want. But I still think the menu should include a property to achieve this without the need to write any javascript. This is how a menu standard behaves. It will close when you click on it.
  4. David
    David avatar
    3 posts
    Member since:
    Oct 2008

    Posted 29 Dec 2016 Link to this post

    I know this is an old thread, but menu.close() used to work in previous version of Telerik. For some reason it stoped working and collapsing the menu.

    <telerik:RadMenu ID="rad_menu" runat="server" EnableRoundedCorners="true" DataFieldID="id" DataFieldParentID="parentID"

    EnableEmbeddedSkins="false" Skin="CetTelerikSkin" ExpandAnimation-Duration="0" ExpandAnimation-Type="None" CollapseAnimation-Type="None" CausesValidation="False" ClickToOpen="false" ExpandDelay="500" CollapseDelay="1500"                                                        

    OnClientItemClicked="OnMenuClientItemClicked"

    EnableRootItemScroll="true" Width="100%">

    <DefaultGroupSettings ExpandDirection="Auto" OffsetY="2" />

     

     

     

    </telerik:RadMenu>

    <script type="text/javascript">

    function OnMenuclientItemClicked(sender, args){

    sender.close();

    }

    </script>

    Any thoughts on why it stopped to work, and if there is a workaround for this?

     

     

     

  5. Plamen
    Admin
    Plamen avatar
    2933 posts

    Posted 01 Jan 2017 Link to this post

    Hi,

    Thank you for sharing the issue.

    Yes indeed -due to a major change that we had to push in the control we recommend using setTimeout when invoking the close function from the click event of the control:
    setTimeout(function() {
                 sender.close();
             }, 0);


    Regards,
    Plamen
    Telerik by Progress
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  6. David
    David avatar
    3 posts
    Member since:
    Oct 2008

    Posted 03 Jan 2017 Link to this post

    Thank you Plamen, It works.
  7. Mark
    Mark avatar
    2 posts
    Member since:
    Dec 2014

    Posted 23 Mar 2018 Link to this post

    So the setTimeout seems to work except when render mode is using Mobile from a phone.  I have set rendermode="Mobile" and it seems to work from my desktop but when I use my iphone, it will collapse the menu, but it doesn't seem to execute the NavigateUrl into my target.

     

    Any ideas?

  8. Vessy
    Admin
    Vessy avatar
    1889 posts

    Posted 28 Mar 2018 Link to this post

    Hi Mark,

    Did you try increasing the timeout value passed to the close() method?
    setTimeout(function() {
         sender.close();
    }, 100);

    You can also test if removing the timeout at all will help (in this way the browser will add this task to the end of the current queue):
    setTimeout(function() {
        sender.close();
    });


    Regards,
    Vessy
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  9. Mark
    Mark avatar
    2 posts
    Member since:
    Dec 2014

    Posted 28 Mar 2018 in reply to Vessy Link to this post

    Yes, that looks to have fixed the issue.

     

    Thanks!

    Vessy said:Hi Mark,

    Did you try increasing the timeout value passed to the close() method?

    setTimeout(function() {
         sender.close();
    }, 100);

    You can also test if removing the timeout at all will help (in this way the browser will add this task to the end of the current queue):
    setTimeout(function() {
        sender.close();
    }, 0);


    Regards,
    Vessy
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  10. Vessy
    Admin
    Vessy avatar
    1889 posts

    Posted 28 Mar 2018 Link to this post

    Hi,

    You are welcome, Mark - I am glad the suggested solution is working for you.

    Regards,
    Vessy
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top