ASP.Net submenu not show after postback - c#

I has use ASP.Net menu control in master page. And I wrap the Maincontent using update panel. When postback is happen, the sub menu in master page not showing when mouse over. I need click again the menu then mouseover the menu the sub menu only show.
Master page
<div class="float-right">
<nav>
<asp:Menu ID="mne" runat="server" Orientation="Horizontal" Font-Names="Arial, Verdana, Tahoma"
OnMenuItemClick="mne_MenuItemClick" StaticEnableDefaultPopOutImage="false" Width="510px"
DynamicHorizontalOffset="20" StaticSubMenuIndent="250px" TabIndex="1" >
<LevelMenuItemStyles>
<asp:MenuItemStyle CssClass="level1" HorizontalPadding="10px" />
</LevelMenuItemStyles>
<StaticMenuStyle />
<DynamicMenuStyle />
<StaticHoverStyle BackColor="Wheat" />
<DynamicHoverStyle BackColor="Gray" ForeColor="White" />
<Items>
<asp:MenuItem NavigateUrl="~/Default.aspx" Text="Home"
Value="Home"></asp:MenuItem>
<asp:MenuItem Text="Management" Value="Management"
ToolTip="Management">
<asp:MenuItem Text="Edit" Value="Edit" ToolTip="Edit
NavigateUrl="~/Edit.aspx">
</asp:MenuItem>
</asp:MenuItem>
<asp:MenuItem Text="Logout" Value="Logout"></asp:MenuItem>
</Items>
</asp:Menu>
</nav>
</div>
</div>
</header>
Edit.aspx
<asp:DropDownList ID="Country" runat="server" AutoPostBack="true" OnSelectedIndexChanged="Country_SelectedIndexChanged">
</asp:DropDownList>
After the drop down list postback, mouseover the menu, the submenu not showing. I need click on the menu then mouseover the submenu will display.
Anything is go wrong? Please help

I've also been experiencing this intermittently, and none of the other suggestions worked for me. I eventually decided to rem out every line of server-side code and then un-rem them section by section until I discovered what was causing it.
Turns out that it was as a result of server-side JavaScript injection using the ClientScript.RegisterStartupScript(...) method. In certain cases, the client-side objects referred to in the injected JavaScript were not visible at the time the script was injected. Others have hinted at page life-cycle being the root cause of this problem, and this would bear it out.
Once I'd discovered this, I was able to fix it quite easily by making sure that the script checked for visibility of document elements before referencing them. The surprising thing was that, despite having JavaScript warnings enabled, this did not generate any client-side errors.

Disable postback of root or parent menu:
MenuItem mnu = new MenuItem();
// if mnu has sub item(s)
mnu.Selectable = false;
this option is more useful when application opened by a mobile device.

Related

How to popup visible from code behind and catch its events?

I'm developing a web forms application in .NET, however I'm more well versed in back end programming rather than front end. I need a pop-up window which is meant to show up and collect the experience from the user with the application, done by three image buttons, each with their own event.
For this purpose, I found a CSS based modal window that I modified so that it looks like the pop-up I want. The html for this is as follows:
Modal!
<div runat="server" id="dia" class="modal-dialog">
<h3>How was your experience?</h3>
<div class="modal-body">
<asp:ImageButton ID="ImageButton1" imageURL="~/resources/smileyface.png" runat="server" Width="75" Height="75" />
<asp:ImageButton ID="ImageButton2" imageURL="~/resources/neutralface.png" runat="server" Width="75" Height="75" />
<asp:ImageButton ID="ImageButton3" imageURL="~/resources/sadface.png" runat="server" Width="75" Height="75" />
</div>
</div>
This produces a button named Modal (first a tag) and opens the window with a nice transition specified by the CSS.
I want to be able to make the pop-up visible from code behind. Something like
popup.Visible=true;
And to be able to catch the OnClick events of the three image buttons.
Could anyone point me in the right direction? Thank you in advance.
I can give you an advice with jquery UI Dialog as an example:
To call it from code behind you can use:
ClientScript.RegisterStartupScript(this.GetType(),"anyKey",
"$('#dialog').dialog();$('#dialog').parent().appendTo($('form:first'));",true);
It is important to append it to the form in order to make the OnClick Events work.
Inside your Dialog you can declare your asp serverside controls, like your imagebutton.
<div id="dialog" title="My Dialog">
<p>I Am a Dialog</p>
<asp:ImageButton ID="imgbtn1" runat="server" OnClick="imgbtn1_Click" />
</div>
The OnClick Event will be catched.

asp.net webform Menu control how to indent wrapped items?

I'm using a standard asp.net Menu control to display a menu on my page, and I have the text wrap option set to true. What I'd like to do is indent the wrapped text as a visual clue that its part of the line above.
I followed this question: Can you apply CSS only on text that is wrapped, i.e. the second and subsequent lines?
but I can't see how to format the MenuItem elements within the Menu control. Can this be referenced with CSS?
Not sure if this will help... but here is my html:
<asp:Menu ID="MSDSMenu" runat="server" Width="100%" CssClass="noPrint" ItemWrap="True">
<Items>
<asp:MenuItem Text="Search SDS" Value="Search MSDS" NavigateUrl="~/MSDS/SearchMSDS.aspx" />
<asp:MenuItem NavigateUrl="~/MSDS/ByDept.aspx?dept=Shipping%25%27%20OR%20UsageDept%20LIKE%20%27%25Receiving"
Text="Shipping / Receiving" Value="Shipping / Recieving" />
<asp:MenuItem NavigateUrl="~/MSDS/ByDept.aspx?dept=Other" Text="Other" Value="Other" />
</Items>
</asp:Menu>
There are several levels of styling on a menu:
<asp:Menu ID="Menu1" runat="server"
CssClass="menuBar_style" >
<LevelSubMenuStyles>
<asp:SubMenuStyle CssClass="sub_style_top" />
<asp:SubMenuStyle CssClass="sub_style_lvl1" />
</LevelSubMenuStyles>
<LevelMenuItemStyles>
<asp:MenuItemStyle CssClass="item_style_top" />
<asp:MenuItemStyle CssClass="item_style_lvl1" />
</LevelMenuItemStyles>
<Items>
<asp:MenuItem />
<asp:MenuItem />
<asp:MenuItem />
</Items>
</asp:Menu>
there's the css for the Menu itself, but then you can also define LevelSubMenuStyles and LevelMenuItemStyles, with separate style items within both of those for each level of your menu (in your case only the one level by the looks of it).
I reccommend trying to apply your wrapping to the MenuItemStyle css as this affects the actual control (i.e. the text usually), SubMenuStyle affects the container around the control I think.
Hope that makes sense... it's awfully confusing business, your best bet is to play around with the different tags for a while until you get a feel for them in your own head and hopefully you'll see what I mean.
EDIT: I've just noticed this question is from two years ago! No idea how I ended up here, one minute I was browsing the latest questions and next... I'll leave the answer here in any case as menu styling has been a source of frustration for me in the past and this may help somebody else.

ASP Drop Down collapses after first click

I have an ASP Drop Down List that opens then immediately collapses on one click. I'm using a Drop Down on another page with the same CssClass, and it's working fine (first click expands the DDL and the second click collapses it). Anyone have any idea what could be happening? I would greatly appreciate any suggestions or input.
<label>
<asp:RadioButton ID="rbToAccount" runat="server" GroupName="rbTo" />
Account
<asp:DropDownList ID="ddlToAccount" runat="server" CssClass="span4 m-wrap">
</asp:DropDownList>
</label>
Try This :
<label></label>
<asp:RadioButton ID="rbToAccount" runat="server" GroupName="rbTo" />
Account
<asp:DropDownList ID="ddlToAccount" runat="server" CssClass="span4 m-wrap">
</asp:DropDownList>
is the event tied to a Jquery function??
It sounds like on dropdown list change it is causing a postback, which then is refreshing the page to it's original state. Try adding OnClientClick="return false" as an attribute to the ddl control

How to disable MenuItem in asp .net with javascript

I have created a menu
<asp:Menu ID="Name1" runat="server" OnMenuItemClick="DoSth_MenuItemClick" Visible="true">
<Items>
<asp:MenuItem Text="Function description" Value="Val" ToolTip="ToolTip description" meta:resourcekey="resourceKey">
</asp:MenuItem>
</Items>
</asp:Menu>
And now I want to enalbe/ disable dynamically MenuItem with JavaScript
I tried to do it with the following JavaScript function
function hideMenu() {
var menu = $get('<%=Name1.ClientID %>');
menu.getItems().getItem(0).set_enabled(false);
}
I got menu object however it is HTMLTalbeElement and then it fail in the second line.
Is there a way to do it?
I don't think you can disable a menu item.
As it rendered as anchor tag.
As I think you can set it to javascript:void(0);
You can set the css-class for your menu and submenu.
And use jquery to find the menu and set it's URL to javascript:void(0);

Set asp:MenuItem as active

I have this asp:menu with a few items and want to be able to set an item as active when I've clicked it.
Here it goes
<asp:Menu ID="NavigationMenu" runat="server" CssClass="menu" EnableViewState="false" IncludeStyleBlock="false" Orientation="Horizontal">
<Items>
<asp:MenuItem NavigateUrl="~/pages/page_a.aspx" Text="PageA" />
<asp:MenuItem NavigateUrl="~/pages/page_b.aspx" Text="PageB" />
<asp:MenuItem NavigateUrl="~/pages/page_c.aspx" Text="PageC" />
</Items>
</asp:Menu>
This renders a menu looking something like this
PageA PageB PageC
When clicking something like PageB I'd like to be able to style it somehow, like adding a css or whatever returning this
PageA PageB PageC
Any advices where I can find some info or samples?
You can apply a CSS class or styles to a menu item using the 'selectedstyle' properties of the asp:Menu control, using syntax like this:
<staticselectedstyle backcolor=LightBlue
borderstyle="Solid"
bordercolor="Black"
borderwidth="1"/>
A more full example is described in this MSDN article.
EDIT in response to comment:
There is also the 'dynamicselectedstyle' property for dynamic menus which used the same syntax:
<dynamicselectedstyle backcolor=LightBlue
borderstyle="Solid"
bordercolor="Black"
borderwidth="1"/>

Categories