On my page there is update panel and one text box and button inside same update panel. after i set enter key as default button for update panel. After multiple post back actually after third post back focus is set to the back button of browser. where as i want to set focus to the text box. i tried to set focus to the first text box by using below option which i have written at last line of button event.
1. option => Page.SetFocus(txtOrdertoAdd.ClientID);
2. option => txtOrdertoAdd.Focus();
3. option => Page.ClientScript.RegisterStartupScript(this.GetType(), "Script", "SetFocus(" + txtOrdertoAdd.ClientID + ");</script>");
4. option => ScriptManager.RegisterStartupScript(this, this.GetType(), "selectAndFocus", "$get('" + txtOrdertoAdd.ClientID + "').focus();", true);
i am facing this wired issue specifically in IE where its working fine in fire fox and chrome.Can any one how can i resolve this issue.
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<div>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Panel runat="server" ID="Panel1" DefaultButton="Button1">
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" />
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</form>
</body>
and this:
protected void Button1_Click(object sender, EventArgs e)
{
TextBox1.Text = TextBox1.Text + "1";
TextBox1.Focus();
}
Works fine on IE11.
Can you show what you have?
Related
I have an update panel on a page which contains nested Panels. It has a Panel with a small form (like a log-in form) and a button. When the button is clicked, a few conditions are checked, and if passed, the first Panel is hidden and the second Panel with a larger form is displayed.
Because the larger form can take some time to load (it pulls data from other sources), the small form panel contains an UpdateProgress control.
All of this works fine.
Then I added a nested Panel within the login form Panel, placed under the UpdateProgress that will display a meaningful error message, such as if the login code is incorrect. This displays as expected. However, if the user then corrects their information and clicks the button again, the UpdateProgress displays properly, but the error message remains visible, even though I try to set it to Visible = false in code-behind.
This page does not use a master page.
Debugging shows that the Visible property does get set to false, although it still displays in the browser.
ASPX code:
<%# Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="custom_Default" %>
<!DOCTYPE html>
<html lang="en">
<head runat="server">
<!-- meta and link tags -->
</head>
<body>
<form id="form1" runat="server">
<div class="container">
<!-- h1 and all that -->
<asp:ScriptManager ID="scriptManager" runat="server"></asp:ScriptManager>
<asp:UpdatePanel ID="pnlUpdate" runat="server">
<ContentTemplate>
<asp:Panel ID="pnlLogin" runat="server">
<!-- label and text field -->
<asp:Button ID="btnBegin" runat="server" OnClick="btnBegin_Click" />
<asp:UpdateProgress ID="updProgress" runat="server" AssociatedUpdatePanelID="pnlUpdate">
<ProgressTemplate>
<p>Loading, please wait... </p>
</ProgressTemplate>
</asp:UpdateProgress>
<asp:Panel ID="pnlMessage" runat="server" Visible="false">
<asp:Literal ID="ltlMessage" runat="server" />
</asp:Panel>
</asp:Panel>
<asp:Panel ID="pnlMainForm" runat="server" Visible="false">
</asp:Panel>
<asp:Panel ID="pnlConfirmation" runat="server" Visible="false">
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</form>
<!-- javascript - jquery and bootstrap -->
</body>
</html>
Code Behind (I've tried setting visible to false in the Page_Load, in the pnlUpdate_Load event, and in the btnBegin_Click event - but that error message will not go away.
protected void btnBegin_Click(object sender, EventArgs e)
{
pnlMessage.Visible = false;
Page.Validate();
if (Page.IsValid)
{
// check some conditions. if fails:
ltlMessage.Text = "Reason for failure";
pnlMessage.Visible = true; // works
}
}
I have tried removing the Visible="false" from the pnlMessage on the ASPX page and placing it in the code behind in Page_Load but I still can't hide it after the message has already been displayed.
How can I hide the pnlMessage Panel after the btnBegin is clicked the second time?
I managed to find the solution to this. Apparently there isn't a way to do it in .NET - it has to be done in JavaScript.
Here is the code I used to accomplish this.
<script type="text/javascript">
var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_initializeRequest(initializeRequest);
prm.add_endRequest(endRequest);
var _postBackElement;
function initializeRequest(sender, e) {
if (prm.get_isInAsyncPostBack()) {
e.set_cancel(true);
}
$get('pnlMessage').style.display = 'none';
}
function endRequest(sender, e) {
$get('pnlMessage').style.display = 'block';
}
</script>
I have that example:
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<fieldset>
<legend>UpdatePanel</legend>
<asp:Label ID="Label1" runat="server" Text="Panel created."></asp:Label><br />
</fieldset>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Button1" />
</Triggers>
</asp:UpdatePanel>
<asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Button" /></div>
protected void Page_Load(object sender, EventArgs e)
{
// doesn work with:
Response.Write("eg.");
}
protected void Button1_Click(object sender, EventArgs e)
{
Label1.Text = "Refreshed at " + DateTime.Now.ToString();
}
This works fine. When I click in the Button the Label updates without refreshing the page, but if I have Response.Write in the Page_Load event, when I click the button the UpdatePanel doesn't work, and I need the Page_Load.
How I can solve my problem? Thanks.
Don't use Response.Write() in your Page_Load function, as it will break the UpdatePanel.
In fact, using Response.Write() is often a bad idea, because you don't control where in the DOM the written content will end up. Instead, if you need some simple debug output, then use other means such as System.Diagnostics.Debug.WriteLine(). Or if you need to add something to the DOM, add a control such as Label and manipulate that.
I have a user control which acts as a form for updating student records. This user control is used in a page called students update. After the update is sucessfull, I want to disable the update button. After that, if the user changes any text, the update button should be enabled back. I am trying this but it is not working. I have all my textboxes autopost property to true. I am able to disable, but I am not able to enable it again if user starts entering new text in the text box. I am using the textbox.textchanged event to achieve this.
A Jquery approach :
<body>
<form id="form1" runat="server">
<div>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:Button ID="Button1" runat="server" Text="Button" Enabled="false" />
</div>
</form>
<script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.9.0.min.js" type="text/javascript"></script>
<script type="text/javascript">
$("#<%= TextBox1.ClientID %>").keyup(function () {
$("#<%= Button1.ClientID %>").attr("disabled", $(this).val() == "");
});
</script>
</body>
Or you can do this server-side :
<asp:textbox id="TextBox1" runat="server" autopostback="True" ontextchanged="TextBox1_TextChanged"></asp:textbox>
<asp:button id="Button1" runat="server" enabled="False" text="Button" />
protected void TextBox1_TextChanged(object sender, EventArgs e)
{
Button1.Enabled = !String.IsNullOrEmpty(TextBox1.Text);
}
#Hoangnnm solution looks OK. Just include the later jQuery Lib, e.g. version 1.9.0 instead of 1.4.1 which is quite obsolete:
<script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.9.0.min.js" type="text/javascript"></script>
I am new to web programming. I have a pretty standard page that accepts contact information and I am trying to add validation controls to it. When the user clicks the cancel button nothing is saved so I just want to unload the page and go back to the previous page. My problem is, even the the cancel button has CausesValidation="false the validation events are still firing and a post back does not occur. I am using Visual Studio 2012 and C#. I've created a test page to reduce the code I'm working with to the minimum required code to demonstrate the issue. I have tried the javascript disableValidation() function with both Page_Validation = false; and the loop to disable the individual validation controls without success. When I check Page_Validation it is false, and the loop throws the exception Page_Validators is undefined.
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="TestMe.aspx.cs" Inherits="ElmoWeb.TestMe" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
<title>Simple Little Test Form</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:TextBox ID="uxEmail" runat="server" placeHolder="email address" type="email" AutoCompleteType="Email"></asp:TextBox>
<asp:RegularExpressionValidator ID="uxEmailValidator" runat="server"
ControlToValidate="uxEmail"
ValidationExpression="^[a-zA-Z][\w\._%+-]*[a-zA-Z0-9]#[a-zA-Z0-9][\w\.-]*[a-zA-Z0-9]\.[a-zA-Z][a-zA-Z\.]*[a-zA-Z]$"
ErrorMessage="The email address is invalid"
EnableClientScript="false" ValidationGroup="testing"
Display="Static"/>
</div>
<div>
<asp:Button ID="Submit" runat="server" Text="Submit" CausesValidation="true" UseSubmitBehavior="true" ValidationGroup="testing" />
<asp:Button ID="Cancel" runat="server" Text="Cancel" CausesValidation="false" UseSubmitBehavior="true" ValidationGroup="FakeValidationGroup" />
</div>
<div>
<asp:ValidationSummary ID="ValidationSummary1" runat="server" DisplayMode="List" HeaderText="You must correct the following errors." ValidationGroup="testing" />
</div>
</form>
</body>
</html>
Currently the code behind just writes a message to the output window so I can see if the post back occurred.
protected void Page_Load(object sender, EventArgs e)
{
System.Diagnostics.Debug.WriteLine("TextMe.aspx Page_Load event, sender = " + sender.ToString() + ", EventArgs = " + e.ToString());
}
The natural way of solving issues where two or more submit buttons should behave in a different way is to use validation groups.
A validation group is set with the ValidationGroup attribute on both a submit button and a group of validators. The same value binds a button and validators and only validators with the same value of the attribute fire when the button is clicked.
In your case, setting the ValidationGroup on the accept button and your validators to "Accept" and leaving the default (empty) value on the cancel button would solve your issue. This is much simpler than any of the workarounds you tried.
I have a simple JQuery enabled ASP.NET page:
<script>
$(document).ready(function() {
$("#accordion").accordion();
});
</script>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<div id="accordion">
<h3><a id="Accordion1" href="#">Accordion Panel 1</a></h3>
<div>
A form input...
<asp:Button id="btnSubmit" runat="server" onclick="btnSubmit_Click" />
</div>
<h3><a id="Accordion2" href="#">Accordion Panel 2</a></h3>
<div>
Some content...
</div>
</div>
</ContentTemplate>
</asp:UpdatePanel>
If you'll notice, I'm using an UpdatePanel also.
btnSubmit_Click event does something like this:
protected void btnSubmit_Click(object sender, EventArgs e)
{
//Some MySql INSERT, etc.
}
Now what I want to do is for server-side btnSubmit_Click to trigger JQuery to "click" Accordion Panel 2 (so it will open Accordion Panel 2 and close 1). How to do this?
UPDATE: Sorry guys I forgot to mention earlier that It's got an UpdatePanel
Oh well, I just used the "change the value of a hiddenfield after postback then let jquery read that hiddenfield" approach. Thanks guys!
Jquery:
var tag = $("#contentBody_hfTag1").val();
if (tag=="1") { $(".Accordion").accordion({ active: 1 }); }
else { $(".Accordion").accordion({ active: 0 }); }
.aspx
<asp:HiddenField ID="hfTag1" ClientIDMode="Predictable" Value="0" runat="server" />
C#
protected void btnMyButton_Click(object sender, EventArgs e)
{
hfTag1.Value = "1";
}
You can't. Jquery runs on the client, your handler is on the server. You will need to trigger the event on the client when the page reloads after the post back.
You can't do that as Jquery works on client side, from a server side event, as the page reloads. And the state of the accordion will be lost. So what you can do is, instead of making a post back, you can do the same work in a Jquery AJAX call on the button click to do whatever you want and then close the accordion 1 and show accordion 2.
<asp:UpdatePanel ID="up1" runat="server">
<ContentTemplate>
<i88:InlineScript runat="server">
<script type="text/javascript">
$('Accordion2').click()
</script>
</i88:InlineScript>
<asp:Button ID="cmd" runat="server" Text="Update" />
</ContentTemplate>
</asp:UpdatePanel>
You can put inlineScript which will get Executed every time you update the Panel.
You can also use jQuery.Trigger(); for other event's.