Open RadMenuItem with Button

[Daniel]

Hello,

I am working on a project with a RadMenu.
My project requirement is that when the user clicks on a button, the RadMenuItem will open.

The menu is defined as follows: (ASPX)

<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
            <script type="text/javascript">

                function ExternalitemOpened(s, e) {
                    if ($telerik.isIE8) {
                        // Fix an IE 8 bug that causes the list bullets to disappear (standards mode only)
                        $telerik.$("li", e.get_item().get_element())
                            .each(function () { this.style.cssText = this.style.cssText; });
                    }
                }




                function External_MouseOver(sender, args) {
                    if (args.get_item().get_parent() == sender) {
                        sender.set_clicked(false);
                    }
                }


                function ExternalOnClientItemClicking(sender, args) {
                    if (args.get_item().get_isOpen() == true) {
                        args.set_cancel(true);
                        args.get_item().close();
                    }
                }




            </script>
        </telerik:RadCodeBlock>

<telerik:RadMenu ID="RadMenu_SpecialReport" runat="server" ClickToOpen="True" EnableShadows="True" OnClientItemOpened="ExternalitemOpened" OnClientItemClicking="ExternalOnClientItemClicking" OnClientMouseOut="External_MouseOver" Style="top: 0px; left: -2px; z-index: 100; height: 35px;" Skin="ExternalGridButtons" EnableEmbeddedSkins="false">
                <Items>
                    <telerik:RadMenuItem PostBack="true" Text="Special Reports" Value="Special_Reports" CssClass="btn  btn-primary btn-menu-grid-size">
                        <ContentTemplate>
                            <div id="Special_panel" class="Special_panel" style="width:300px; height:500px; background-color:white;">

                                <telerik:RadAjaxPanel ID="RadAjaxPanel_SpecialReport" runat="server"  Width="80%"></telerik:RadAjaxPanel>
                                <telerik:RadButton ID="btn_ShowSpecialReport" runat="server" Text="Show Special Report" Skin="Web20" CssClass="btn_Sort" OnClick="btn_ShowSpecialReport_Click"></telerik:RadButton>
                            </div>
                        </ContentTemplate>
                    </telerik:RadMenuItem>
                     <telerik:RadMenuItem PostBack="true" Text="zzzz" Value="zzzzz" CssClass="btn  btn-primary btn-menu-grid-size">
                        <ContentTemplate>
                            <div id="Div1" class="Special_panel" style="width:300px; height:500px; background-color:white;">

                                <telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server"  Width="80%"></telerik:RadAjaxPanel>
                                <telerik:RadButton ID="RadButton2" runat="server" Text="Show Special Report" Skin="Web20" CssClass="btn_Sort" OnClick="btn_ShowSpecialReport_Click"></telerik:RadButton>
                            </div>
                        </ContentTemplate>
                    </telerik:RadMenuItem>
                    <telerik:RadMenuItem IsSeparator="true"></telerik:RadMenuItem>
                </Items>
            </telerik:RadMenu>

Is it possible to achieve this in the code-behind?

I'd love to solve this!

Thank you,
Daniel.

[Hristo Valyavicharski]

Hello Daniel,


You may try to execute the javascript from the server as use RegisterScript, similar approach is used here:
www.telerik.com/forums/radmenu-sub-menus-expand-onclick-but-not-onmousehover

Regards,
Hristo Valyavicharski
Telerik

 

 

[Daniel]

Hi Hristo Valyavicharski,

Thank you very much!!
It works great.

Regards,
Daniel.