Chrome bug asp.net updatepanel posts twice - javascript

This is my markup:
<asp:UpdatePanel ID="updPnl" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:TextBox runat="server" ID="txtEmail" AutoPostBack="true" OnTextChanged="txtEmail_TextChanged" />
<asp:Panel runat="server" Visible="false" ID="pnl">
<asp:TextBox runat="server" ID="txtUname" AutoPostBack="true" OnTextChanged="txtUname_TextChanged" />
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
and this is the code behind:
and these are the event handlers in the code behind:
protected void txtEmail_TextChanged(object sender, EventArgs e)
{
pnl.Visible = true;
updPnl.Update();
txtUname.Focus();
}
protected void txtUname_TextChanged(object sender, EventArgs e)
{
}
If I press enter on txtEmail textbox it works fine in all browsers and the focus comes to txtUName textbox except Chrome. On debugging I found that is happening because Chrome makes Ajax request twice. Is there anyway to fix this Chrome bug?
Note that it works fine in Chrome too if I use Tab instead of enter. However, I need to fix this Chrome bug of Enter too.

you may enter key trigger a post to the form,
you should prevent the submit action on enter (so enter key and tab key would have the same behavior)
you can do it with JavaScript (onkeydown) for instance.
however, I think update panel here is an overkill,
why not to use only JavaScript on the client side?
$("#txtEmail").change(function() {
var email = $(this).val();
// now you can do whatever you want with the value.
});

Related

I used AgreementCheckBox at my asp.net webform with CustomeValidator, but doesn't shows error message

Code at AgreementCheckBox:
<asp:CheckBox ID="AgreementCheckBox" runat="server" ForeColor="Black" Text="Please accept our terms and conditions!" />
Code at AgreementCustomValidator:
<asp:CustomValidator ID="AgreementCustomValidator" runat="server" ClientValidationFunction="AcceptTermsAndConditionsValidation" Display="Dynamic"
ErrorMessage="Please accept terms and conditions!" ForeColor="Red"></asp:CustomValidator>
Server Side Code:
protected void AgreementCustomValidator_ServerValidate(object source, ServerValidateEventArgs agrs)
{
}
Please suggest possible solution, thanks....
When you use CustomValidator, you should set e.IsValid in the event to false if the input is invalid (you also need to check Page.IsValid when the form submits, because ASP.NET doesn't prevent yor form from submitting when there are validation errors).
Your code can look like this code:
protected void AgreementCustomValidator(object sender, ServerValidateEventArgs e)
{
e.IsValid = AgreementCheckBox.Checked;
}

How to run javascript using server side code in ASP.Net Web Form application in update panel?

I want to use some javascript code inside update panel in ASP.Net web form application using serverside code. The problem is the following code only works if i used it outside update panel but not works inside, even with alert.
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Button ID="Button1" runat="server" Text="Server" OnClick="Button1_Click"/><br />
<asp:Button ID="Button2" runat="server" Text="Cleint" OnClientClick="alert('Hello World(Cleint)')"/>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</form>
Code Behind
protected void Button1_Click(object sender, EventArgs e)
{
this.ClientScript.RegisterStartupScript(this.GetType(),
"ShowMessage", string.Format("<script type='text/javascript'>alert('{0}')</script>",
"Hello World (Server)"));
}
when running this application only the Client Click event works but not the server side event. However when removing update panel ant try again both events work.
I searched a lot and found some similar questions but all answers didn't work. I just wanna to fix problem for the example i put above. Thanks
Try to replace your code behind in the button click event with this:
ScriptManager.RegisterStartupScript(this, this.GetType(), this.ClientID, string.Format("alert('{0}')", "Server"), true);
Hope this helps.

Unable to read hidden field value from server side

I have a aspx page (default.aspx), inside which I am loading a user control (tree.ascx).
inside the tree.ascx there is a hidden field.
<asp:HiddenField ID="HiddenField1" runat="server"/>
I am assigning a value to the hidden field using javascript.
document.getElementById('<%=HiddenField1.ClientID%>').value = "some text here";
alert(document.getElementById('<%=HiddenField1.ClientID%>').value);
document.getElementById('form1').submit();
The alert displays the value absolutely fine. which means the value gets inserted in the hidden field properly.
But when I am posting back to server and checking the value, it is always null.
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
// do something.
}
else
{
string str = this.HiddenField1.Value;
}
}
My code is always getting a empty string here. somehow the postback is erasing the value from the hidden field.
What could be the reason?
Try using below syntax. It works for me even after postback.
ASPX code
<asp:HiddenField runat="server" ID="aspHiddenField" />
<input type="hidden" id="inputHidden" value='<%= aspHiddenField.ClientID %>' />
JavaScript Code
var inputHidden = document.getElementById('inputHidden');
$("#" + inputHidden.value).val("some text");
Code Behind
if (!string.IsNullOrEmpty(aspHiddenField.Value))
{
//Your code goes here
}
Check if your control is within a master page, if it is, then you need to access it like that, 1st Master Page->within master page look for the control's value, it will work surely.
Place your hidden field in update panel like :
<asp:UpdatePanel ID="UpnlHidden" runat="server">
<ContentTemplate>
<asp:HiddenField ID="HiddenField1" runat="server"/>
</ContentTemplate>
</asp:UpdatePanel>
This will work for you :-)

ASP.Net session not updated in javascript

when my button is clicked I fire the javascript to get the session..
But value of session not updated...
alert('<%= Session["file"]%>');
It won't be up to date if its changed after the page is rendered.
You might want to look at page methods (an ajax system) or another ajax approach.
Any inline code once rendered to the page will not change, which is a normal behavior.
use a Hidden field instead.
mark-up:
<asp:HiddenField ID="HiddenField1" runat="server" />
<asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" />
code-behind:
protected void Button1_Click(object sender, EventArgs e)
{
Session["file"] = "Data Here";
HiddenField1.Value = Session["file"].ToString();
}
javascript:
alert(document.getElementById('<%= HiddenField1.ClientID %>').value);

Why can't I hit the event handler in the code behind doing a modal popup postback

I am basically trying to do what this article says.
link text I am able to postback, but my handler is not getting hit. Any ideas?
Code Behind
protected void Page_Init(object sender, EventArgs e)
{
WireEvents();
}
private void WireEvents()
{
btnAuthOk.Click += new EventHandler(btnAuthOk_Click);
btnAuthOk.OnClientClick = string.Format("fnClickOK('{0}','{1}')", btnAuthOk.ClientID, string.Empty);
}
private void btnAuthOk_Click(object sender, EventArgs e)
{
DoSomeCodeHere();
}
Javascript & HTML
function fnClickOK(sender, e) {
__doPostBack(sender, e);
}
<p>To allow this payment to be processed, enter an authorized User ID and Password</p>
<p>User ID: <asp:TextBox runat="server" ID="txtAuthUser" CssClass="underlinedTextBox" Columns="8" />
<asp:Literal runat="server" ID="spauth" Text=" " />
Password : <asp:TextBox runat="server" ID="txtAuthPass" TextMode="Password" CssClass="underlinedTextBox" Columns="10" />
</p>
<asp:Button runat="server" ID="btnAuthOk" Text="Submit" CssClass="popupAuthButton" UseSubmitBehavior="false" />
</asp:Panel>
<cc1:ModalPopupExtender ID="authPE" runat="server" PopupControlID="popupAuth"
OkControlID="btnAuthOk" TargetControlID="hdnPopupTarget" BackgroundCssClass="modalBackground" />
Thanks for any help here...
Cheers,
~ck
PS Stack is mucking my html a bit as I don't know how to properly post HTML. Is someone can edit and fix, I appreciate it. :)
I found that setting UseSubmitBehavior="false" actually allows me to hit my code.
If you just want your OK button to do a postback, simply remove the OkControlID attribute from your ModalPopupExtender markup.
I know, I know - that sounds ridiculous. But when you specify OK and Cancel button ID's to the MPE, it actually disables them from posting back on the client side.

Categories