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

Radmenu doesn't close when another radmenu on the page is clicked

4 Answers 83 Views
Menu
This is a migrated thread and some comments may be shown as answers.
Javier
Top achievements
Rank 1
Javier asked on 15 Aug 2012, 02:59 PM
I've got 2 radmenus on the same page that have clicktoopen set to true.

If I click on a menu it opens, then if I click away it closes.  Unless I click on the second menu, then the first menu remains open and the second menu opens up as well.

I would like to have the first menu close when the second menu is clicked.
I tried adding a onblur client event to the menus where I close the menu if focus is taken away, but that caused 2 issues.

1) The clicked property remains set to 'true' so when I hove the mouse the menu opens up again without having to click.
2) I have a checkbox inside of the menu template, when I click the checkbox, the menu technically loses focus and tries to close then immediately reopens.  

Concerning point 1.
If I set clicked to false in the same event, then the menu can't be closed by clicking on it a second time, it starts to close then immediately reopens again.  

Thanks,
Javier

4 Answers, 1 is accepted

Sort by
0
Boyan Dimitrov
Telerik team
answered on 16 Aug 2012, 03:47 PM
Hello Javier,

Thank you for contacting Telerik Support team,

Just as you assumed you could use JavaScript functions to achieve a behavior, that will fit your requirements.  Add this piece of code to you page:

//javascript:

function RadMenu1_onClicking(sender, eventArgs) {
            var menu = $find("<%= RadMenu2.ClientID %>");
            var openedItem = menu.get_openedItem();
            if (openedItem != null) {
                 openedItem.close();
              }

//aspx:
<telerik:RadMenu
    ID="RadMenu1"
    runat="server"
    ClickToOpen="True"
    OnClientItemClicking="RadMenu1_onClicking"
    ........
</telerik:RadMenu>


Clicking on RadMenu1 will trigger a function, that will check if there is an opened item in RadMenu2 and if yes, it will close it.

Please apply the above approach also for RadMenu2.

Here you can find detailed information about the RadMenu Client-Side API.

If you have any further questions, don't hesitate to contact us again.

Kind regards,
Boyan Dimitrov
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Javier
Top achievements
Rank 1
answered on 16 Aug 2012, 06:07 PM
Thank you very much.  I ended up putting the menu's in user controls and I don't know how many usercontrols/menus will end up being on a given page or the names.  

Is there a way to implement this same technique to close any radmenus on a page that isn't the sender?

Thanks,
Javier
0
Javier
Top achievements
Rank 1
answered on 16 Aug 2012, 06:36 PM
Okay, I've got a solution that works.
I have an external js file that contains a lot of functions I'm using here.  So I added the following code.
var RadMenuItemIDs = new Array();
function AddMenuToArray(sender, args) {
    if (arrayContains(RadMenuItemIDs, sender.get_id()))
        return;
    var index = RadMenuItemIDs.length;
    RadMenuItemIDs[index] = sender.get_id();
 
}
function CloseAllOpenMenus(sender, args) {
    for (var i = 0; i < RadMenuItemIDs.length; i++) {
        if (RadMenuItemIDs[i] != sender.get_id()) {
            var menu = $find(RadMenuItemIDs[i]);
            var openedItem = menu.get_openedItem();
            if (openedItem != null) {
                openedItem.close();
      menu.set_clicked(false);
            }
        }
    }
}
function arrayContains(array, item) {
    for (var i = 0; i < array.length; i++) {
        if (array[i] == item)
            return true;
    }
    return false;
}

Then in the markup of the radmenu in the user control I added the two handlers defined above.

<telerik:RadMenu OnClientLoad="AddMenuToArray" OnClientItemClicking="CloseAllOpenMenus"

So when it closes it just iterates through the array of Radmenu Id's checking for any menus other than itself that are open.

Thanks for your help.
0
Boyan Dimitrov
Telerik team
answered on 21 Aug 2012, 02:24 PM
Hello Javier,

Thank you for sharing your code with the community. We appreciate that and hope, that our forum visitors will find it useful.

Regards,
Boyan Dimitrov
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Tags
Menu
Asked by
Javier
Top achievements
Rank 1
Answers by
Boyan Dimitrov
Telerik team
Javier
Top achievements
Rank 1
Share this question
or