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

RadMenu MenuItem Css class

6 Answers 274 Views
Menu
This is a migrated thread and some comments may be shown as answers.
Harry Kable
Top achievements
Rank 1
Harry Kable asked on 22 May 2010, 04:15 AM
Hi
I am using a RadMenu with items created on the client. All menu item selection events are client side.
It appears that the hover Css class is maintained by a menu item when clicked and only removed when another item is clicked.
This is not desirable when a root item has no child items.
In one instance in my application, selecting a root item opens a modal RadWindow. Once the RadWindow is closed, the hover Css class on the selected root item can not be removed. It remains set until the application is rebooted.
Is there a remedy for this issue?
Regards
Harry Kable

6 Answers, 1 is accepted

Sort by
0
Yana
Telerik team
answered on 25 May 2010, 11:37 AM
Hello Harry,

I guess that this is the selected style of the menu items, you can remove it by setting EnableSelection property to "false".

Kind regards,
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.
0
Harry Kable
Top achievements
Rank 1
answered on 25 May 2010, 02:05 PM
Hi Yana
Thanks you for your reply. I have tried your suggestion and it does not appear to make any difference to the behaviour of the menu.
In the case of a root menu item opening a modal RadWindow, the hover Css Class remains selected. Once the RadWindow is closed the hover Css Class can not be removed. ie using the Office2007 skin, the selected item remains orange and no amount of click it or any other menu item will change that.
I have attempted to research the EnableSelection property of the RadMenu but the online help is not very helpful.
Can you please have another look at this issue.
Thanks and regards
Harry Kable
0
T. Tsonev
Telerik team
answered on 28 May 2010, 09:22 AM
Hi Harry,

You can see if the menu has a selected item and unselect it:

var selectedItem = $find("RadMenu1").get_selectedItem()
if (selectedItem) selectedItem.set_selected(false);

The EnableSelection property instructs the menu to highlight the currently selected item. As you've noticed the selected state will be kept until another item is selected. When EnableSelection is set to "false" only focused state will be maintained and it will be cleared when another element on the page is focused.

I hope this helps.

Sincerely yours,
Tsvetomir Tsonev
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.
0
Harry Kable
Top achievements
Rank 1
answered on 29 May 2010, 03:06 PM
Hi Tsvetomir
Thank you for your reply. I would like to tell you that your suggestion had fixed my problem but it has not.
Neither the EnableSelection property nor the set_selected method seem to make any difference. In fact the get_selectedItem method returns null immediately after clicking an item. That does not surprise me as the menu item shows the hover colour not the selected colour.
These are the facts:
- I am clicking a root menu item which has no child items
- the click event opens a modal RadWindow
- the menu item button maintains the hover background colour (not the selected colour) even when the RadWindow is closed and another root menu item is selected. At that time there are 2 menu items selected. 
- I cannot remove the hover background colour from the offending button without closing the browser.
At the moment this is a show stopper for Telerik controls.
Thanks and regards
Harry Kable
0
T. Tsonev
Telerik team
answered on 02 Jun 2010, 12:48 PM
Hi Harry,

I've created a sample page in order to test the scenario and I can confirm that applying my suggested solution requires a few tricks. Deselecting the item in the itemClicked event won't work as in this moment the item is not yet marked as selected. We need to use a timeout in order to deselect the item after the handler has finished executing:

<%@ Page Language="C#" %>
 
<!DOCTYPE html>
<head id="Head1" runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <asp:ScriptManager ID="RadScriptManager1" runat="server">
    </asp:ScriptManager>
 
    <script type="text/javascript">
        function onItemClick(sender, eventArgs)
        {  
            radalert("Modal dialog");
 
            window.setTimeout(function() {
                // Deselect the item once the menu code has finished executing
                eventArgs.get_item().set_selected(false);
            }, 0);
        }
    </script>
 
    <telerik:RadMenu ID="RadMenu1" runat="server" EnableSelection="true" OnClientItemClicked="onItemClick">
        <Items>
            <telerik:RadMenuItem Text="Open modal window">
            </telerik:RadMenuItem>
            <telerik:RadMenuItem Text="Dummy">
            </telerik:RadMenuItem>
        </Items>
    </telerik:RadMenu>
 
    <%-- We need to bump up the index of the window --%>
    <telerik:RadWindowManager runat="server" ID="RadWindowManager1" style="z-index: 10000;" />
    </form>
</body>
</html>

I was not able to reproduce points 3 & 4 though. Let me know if they still occur with the current solution.

I hope this helps.

Sincerely yours,
Tsvetomir Tsonev
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.
0
Admin
Top achievements
Rank 1
answered on 12 Sep 2010, 01:56 PM
Another method that worked for me is this: In the client code that processes the clicked or clicking event, just set the focus to another object on the page.
Tags
Menu
Asked by
Harry Kable
Top achievements
Rank 1
Answers by
Yana
Telerik team
Harry Kable
Top achievements
Rank 1
T. Tsonev
Telerik team
Admin
Top achievements
Rank 1
Share this question
or