Multi-Level RadToolBarDropDown

[Steve]

We're looking to implement the RadToolbar as a primary UI Interface, and everything works great save for the fact that we sometimes have Drop Down menu items that need submenus.  We know you can't have a RadToolBarDropDown as a button within a RadToolBarDropDown, so that's out, and while we can get that type of functionality with the RadMenu, we then lose the ability to specify validation and validation groups on individual buttons in the toolbar.  We've tried using a RadToolBarButton with an ItemTemplate containing a RadMenu, but our problem with that is that it places the radMenu in a outlined box, so it loses the look of the other tool bar buttons.

Essentially, Is there a way to accomplish this in one of the following ways:

a) use a RadMenu in a RadToolbarButton ItemTemplate, but lose the outline styling around it and instead have it appear like any other toolbar button?

b) Use the RadToolBarDropDown button but have it pop up a menu (maybe a RadContextMenu?) instead of it's normal drop down in the same location that would have appeared?


Were open to other suggestions as well.

Thanks

[Peter]

Hello,

Perhaps, using a context menu is the neatest solution to this requirement. For example, try the following code and let me know if this is acceptable:

<script type="text/javascript">
        function showMenuAt(e, x, y) {
            var contextMenu = $find("<%= RadContextMenu1.ClientID %>");

            if (isNaN(x) || isNaN(y)) {
                alert("Please provide valid integer coordinates");
                return;
            }
            contextMenu.showAt(x, y);
            $telerik.cancelRawEvent(e);
        }

        function OnClientDropDownOpening(sender, eventArgs) {
            var x = eventArgs.get_item().get_element().offsetLeft;
            var y = eventArgs.get_item().get_element().offsetTop + 27;
            showMenuAt(eventArgs.get_domEvent(), x, y);
        }
    </script>

    <telerik:RadToolBar ID="RadToolBar1" runat="server" OnClientDropDownOpening="OnClientDropDownOpening">
        <Items>
            <telerik:RadToolBarButton runat="server" Text="Button 0">
            </telerik:RadToolBarButton>
            <telerik:RadToolBarButton runat="server" Text="Button 1">
            </telerik:RadToolBarButton>
            <telerik:RadToolBarButton runat="server" Text="Button 2">
            </telerik:RadToolBarButton>
            <telerik:RadToolBarDropDown runat="server" Text="DropDown 0">
            </telerik:RadToolBarDropDown>
        </Items>
    </telerik:RadToolBar>
    <telerik:RadContextMenu ID="RadContextMenu1" runat="server">
        <Items>
            <telerik:RadMenuItem runat="server" Text="Root RadMenuItem1">
                <Items>
                    <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 1">
                    </telerik:RadMenuItem>
                    <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 2">
                    </telerik:RadMenuItem>
                </Items>
            </telerik:RadMenuItem>
            <telerik:RadMenuItem runat="server" Text="Root RadMenuItem2">
                <Items>
                    <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 1">
                    </telerik:RadMenuItem>
                    <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 2">
                    </telerik:RadMenuItem>
                </Items>
            </telerik:RadMenuItem>
            <telerik:RadMenuItem runat="server" Text="Root RadMenuItem3">
                <Items>
                    <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 1">
                    </telerik:RadMenuItem>
                    <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 2">
                    </telerik:RadMenuItem>
                </Items>
            </telerik:RadMenuItem>
        </Items>
    </telerik:RadContextMenu>

Greetings,
Peter
the Telerik team

[Max]

Bump?