How do I stop a ModalPopupExtender from showing the popup when a user navigates to the page via the browser's back button?
I tried to implement the solution found here which essentially handles the ModalPopup using client side script but had trouble with its implementation. ($find("modPop") always returns null).
Are there other techniques for handling this?
EDIT: The plot thickens. This only occurs because I am using an UpdatePanel inside of the popup. The code below should duplicate the error. Also note, the use of the dummy button is required.
Click button to show modalConfirm modal
Navigate away from page
Navigate back to page w/ back button
Modal appears undesireably.
<%# Page Language="VB" AutoEventWireup="false" CodeFile="Test.aspx.vb" Inherits="Test" %>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="true"> </asp:ScriptManager>
<span style="display:none;"><asp:Button ID="btnDummy" runat="server" Text="Dummy" /></span>
<asp:Button id="btnShow" runat="server" Text="Show Modal"/>
<ajax:ModalPopupExtender ID="mpTest" runat="server" TargetControlID="btnDummy" PopupControlID="pnlTest"></ajax:ModalPopupExtender>
<asp:Panel id="pnlTest" style="display:none;border:10px solid green" DefaultButton="btnTest" runat="server">
<asp:UpdatePanel ID="upTest" runat="server">
<ContentTemplate>
<asp:Button ID="btnTest" runat="server" Text="Test" />
</ContentTemplate>
<Triggers>
<ajax:AsyncPostBackTrigger ControlID="btnTest" />
</Triggers>
</asp:UpdatePanel>
</asp:Panel>
StackOverflow
</div>
</form>
Partial Class Test
Inherits System.Web.UI.Page
Protected Sub btnShow_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles btnShow.Click
mpTest.Show()
End Sub
Protected Sub btnTest_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles btnTest.Click
mpTest.Hide()
End Sub
End Class
I think this makes sense as when you confirm the modal a full postback doesn't happen but I need to do it this way. Are there any workarounds?
In the solution on the ASP.NET forum, the modPop in $find("modPop") is the behavior id of the modal popup which in your case will be mpTest. Try explicitly setting BehaviorId="mpTest" on your ModalPopupExtender as well and see if it works.
Related
I have no idea why my ajax calender extender not popping up with I click on my textbox
<%# Register assembly="AjaxControlToolkit" namespace="AjaxControlToolkit" tagprefix="cc1" %>
<cc1:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
</cc1:ToolkitScriptManager>
Please select Start date<asp:TextBox ID="TextBoxstart" runat="server"></asp:TextBox>
<cc1:CalendarExtender ID="TextBoxstart_CalendarExtender" runat="server"
Format="dd/MM/yyyy" TargetControlID="TextBoxstart">
</cc1:CalendarExtender>
Please Select End Date <asp:TextBox ID="TextBoxend" runat="server"></asp:TextBox>
<cc1:CalendarExtender ID="TextBoxend_CalendarExtender" runat="server"
Enabled="True" TargetControlID="TextBoxend">
</cc1:CalendarExtender>
When I click in the textbox nothing happens. I have also included the ajaxcontroltoolkit.dll in the bin folder and nothing. I have other projects with this control and no problem at all. I have also used and still nothing
from your current code, TextBoxstart is not in the code snippet. Only "TextBoxend".
The end date should work as you have the calendarextender's TargetControlID set to it. Just not for TextBoxstart.
I'm trying to use jQuery show and hide which seem to work ok in Safari, when I try it on the iPhone, it doesn't work at all. Here is my code;
<script type="text/javascript">
$("#showSearch").click(function () {
$("#searchform").show(1000);
});
</script>
It's a button that when clicked, will show the search form. The form doesn't show on iPhone. Also when I add $('#showSearch').remove(); in there, it doesn't get removed, even if I add a function as the second parameter of show() it still doesn't hide the button.
Thanks for your help.
jQuery Docs:
http://api.jquery.com/show/ (Shows)
http://api.jquery.com/hide/ (Hides)
http://api.jquery.com/remove/ (Deletes)
http://api.jquery.com/toggle/ (Show/Hide)
Live Example:
http://jsfiddle.net/qQnsj/1/
JS
$('#viewMeButton').click(function() {
$('#viewMe').toggle(); // used toggle instead of .show() or .hide()
});
$('#removeMeButton').click(function() {
$('#removeMe').remove();
});
HTML
<div data-role="page" id="home">
<div data-role="content">
<div id="viewMe">
Hello I'm in the div tag, can you see me?
</div>
<br />
<button id="viewMeButton">Show / Hide</button>
<br />
<div id="removeMe">
Click the button to remove me
</div>
<br />
<button id="removeMeButton">Remove Me</button>
</div>
</div>
I know this is an old question, but I recently had a similar problem. Hopefully this will help someone else if they find this question, too.
I was trying to hide a set of ui-block-* elements in a JQM grid. On the same grid cells, my media query for the iPhone was setting display: block !important. That was winning.
The !important directive was unnecessary in my case and when I removed it the calls to hide() and show() began working as expected.
I’m working on asp.net web site in .net 4.0 framework (VS 2010) in Win XP SP2.
In site.master page I have a control and it is populated dynamically. All is well in populating the control, but when mouse is hover on this menu item, it displays correct, but it pushes the content of page below (in my example, the content of “MainContent” is pushed below).
I tried changing the property of div, but no joy.. any help will be much appreciated.
Content of Site.Master
**<div class="title">
<h1>
My ASP.NET Application
</h1>
</div>
<div class="clear hideSkiplink">
<asp:Menu ID="mnuMain" runat="server" BackColor="#FFFFCC" CssClass="menu">
<DynamicItemTemplate>
<%# Eval("Text") %>
</DynamicItemTemplate>
</asp:Menu>
</div>
<div class="main">
<asp:ContentPlaceHolder ID="MainContent" runat="server"/>
</div>
<div class="footer">
</div>**
Sample code to add it dynamically
**MenuItem item = new MenuItem();
MenuItem item1 = new MenuItem();
item.Text = "Main Menu";
item1.Text = "sub menu1";
item.ChildItems.Add(item1);
mnuMain.Items.Add(item);**
You have got a clear on the div that wraps the menu. Instead of clear the wrapper should be floated.
Is there any CSS relate to the mark up above?
I have two buttons inside a form call:
<% using (Html.BeginForm()) {%>
<input type="submit" value="Filter" />
<input type="reset" value="Clear Filter" />
The fields in question:
<td>
<%:Html.TextBox("filterId", Model.IdFilter, new {style="width:100px"}) %>
</td>
<td>
<%:Html.TextBox("filterTitle", Model.TitleFilter, new {style="width:500px"}) %>
</td>
<td>
<%:Html.TextBox("filterStatus", Model.StatusFilter, new {style="width:100px"}) %>
</td>
The first button calls the form action. The second button should either:
Clear the form and not post
Redirect to another action
Not sure why I'm having so much trouble with this, but it seems like there should be a very simple way to do this. However, all the solutions I've come across seem way too complicated for this.
Am I missing something?
EDIT: Here's the solution:
Change the reset button to a plain jane button with an id:
<input type="button" value="Clear Filter" id="clearFilter" />
Then add this script:
$(function () {
$("#clearFilter").click(function () {
$(':input', '#form0')
.not(':button, :submit, :reset, :hidden')
.val('');
$('#form0').submit();
});
})
You may have to write custom script to get the behavior you want. It is a reset button, after all, not a clear button.
At this point, if you change the values of the controls, then click the rest button, the form will be returned to its original state, of the state of whatever the model was when it was rendered.
I have a user control that handles logging a user in to my site. This user control is placed in the upper right corner of all pages as a Quick Login Box. The problem I'm having is that on my production server, the LinkButton click events I have provided for logging in and reset are not firing the OnClick event after a postback. Its like it just forgets to do it.
Normally this wouldn't be such an issue to debug, except that it does not happen when running in debug on localhost (nor when running in release on localhost). It only seems to be occurring on my production server and only on my home page. If I try to login using the user control from any other page it works fine and the OnClick event runs as it normally should. I'm at my wits end here as I just don't know of anymore ways to debug this thing and every suggestion I've encountered on Google does not help. Below is the markup I'm using in my user control, any suggestions or help would be greatly appreciated. The LinkButton's "Login" and "Reset" do not work at all.
<asp:Panel ID="AnonPanel" runat="server" DefaultButton="Login">
<div id="welcome">
<span class="welcome">Welcome </span><span class="guest1">Guest!</span> <span>Login </span>|<span > Signup</span>
</div>
<div id="input_boxarea">
<div id="user_id">
<asp:TextBox ID="UserName" runat="server" CssClass="input_box1"></asp:TextBox>
</div>
<div id="password">
<asp:TextBox ID="Password" runat="server" TextMode="Password" CssClass="input_box1" size="16"></asp:TextBox>
</div>
</div>
<div id="remember">
<div id="reme">
<div id="reme1">
<asp:CheckBox ID="RememberMe" runat="server" />
</div>
<div id="reme2">Remember me</div>
</div>
<div id="loginbutton1"><span class="login"><asp:LinkButton ID="Login"
runat="server" CommandName="Login" onclick="Login_Click">Login</asp:LinkButton></span></div>
<div id="resetbutton1"><span class="login"><asp:LinkButton ID="Reset"
runat="server" onclick="Reset_Click">Reset</asp:LinkButton></span></div>
</div>
<asp:Panel ID="AdminPanel" runat="server" Visible="false">
<div id="welcome_loggedin">
<span class="welcome">Welcome </span><span class="guest1"><asp:LoginName ID="LoginName1" runat="server" />!</span><br />
<asp:HyperLink ID="MyAccountLink" CssClass="memberLink" runat="server" NavigateUrl="/my-account.html">My Account</asp:HyperLink><br />
<asp:HyperLink ID="MyLeaguesLink" CssClass="memberLink" runat="server" NavigateUrl="/my-leagues.html">My Leagues</asp:HyperLink><br />
<asp:HyperLink ID="AdminLink" CssClass="memberLink" runat="server" NavigateUrl="/admin/">Admin Area</asp:HyperLink><br />
<asp:HyperLink ID="IssueTrackerLink" CssClass="memberLink" runat="server" Target="_blank">Issue Tracker</asp:HyperLink><br />
<asp:HyperLink ID="Logout" CssClass="memberLink" runat="server" NavigateUrl="/logout.html">Logout</asp:HyperLink>
</div>
<asp:Panel ID="UserPanel" runat="server" Visible="false">
<div id="welcome_loggedin">
<span class="welcome">Welcome </span><span class="guest1"><asp:LoginName ID="LoginName2" runat="server" />!</span><br />
<asp:HyperLink ID="HyperLink1" CssClass="memberLink" runat="server" NavigateUrl="/my-account.html">My Account</asp:HyperLink><br />
<asp:HyperLink ID="HyperLink2" CssClass="memberLink" runat="server" NavigateUrl="/my-leagues.html">My Leagues</asp:HyperLink><br />
<asp:HyperLink ID="HyperLink3" CssClass="memberLink" runat="server" NavigateUrl="/logout.html">Logout</asp:HyperLink>
</div></asp:Panel>
try changing "causes validation" property to false and see if that makes a difference.
Could you temporarily perform some logging from those event handlers?
You could write to a .txt file on the web server. Or to the event log.
As the first line in the click event, write to the log. Then, perform the desired action (login, reset) in a try-catch block. Both the try and the catch write to the log again. If there's some weird exception happening, you can capture the details in your catch logging.
If you want to leave this temporary code in place, but don't want to perform logging unnecessarily, you could add a toggle in <appSettings> in your web.config file, so that you can turn the logging on and off.