I have a webforms page in ASP.NET 4.0 where I have a panel control with some textboxes on it, some of which are used to capture dates. I am using the CalendarExtender to provide date picking functionality as well as a FilteredTextBoxExtender and MaskedEditExtender to
ensure that only valid characters are entered and in the correct format.
The panel control is displayed only when the user clicks a link button and the date fields as well as a few other fields have RequiredFieldValidators associated with them. When I click the save button, which triggers the validation, I see the error messages
displayed in the ValidationSummary, but the watermarks in the date fields disappear. I am using version 4.1.60501.0 of the AjaxControlToolkit. Is there any way to prevent this? If I don't use update panels this problem doesn't occur.
I tried this also in ASP.NET 3.5 with the AjaxControlToolkit version 3.0.20229.27839 and got the same behavior.
That doesn't work. If I put an update panel within the <body> tag and all my content within the update panel, I still have this problem. If I do without the update panel completely, it works. However, I need to use AJAX here.
My original post was slightly wrong. I am not using a FilteredTextBoxExtender, I am using a TextBoxWatermarkExtender. The problem is if I put the controls within the UpdatePanel, when I click the submit button, the Mask disappears from the date textboxes
(they are blank).
Another thing that I noticed is that if I put RequiredFieldValidators on those textboxes, the validation that occurs thinks the textboxes have values even though nothing was entered by the user.
If I don't use an UpdatePanel, everything works as expected.
Is there any reason why this doesn't work inside an update panel? We have been using this "date picker" in a lot of our other applications but this is the first time that these controls have been placed inside an UpdatePanel.
I have another page in the same application that doesn't have this problem so I copied the code from that page into the one that doesn't work, and then started changing it piece by piece until the content approximated what the page had originally.
What appears to be the problem is that in the page that works, I have a DropDownList with a RequiredFieldValidator attached to it and a button that triggers the validation. If the validation passes, the hidden Panel, which is in the UpdatePanel, is shown.
That's where my date TextBoxes are. Since the DropdownList which requires a selection wasn't needed for this page, I removed it and that's when it stopped working. If I add another validator (in this case a custom validator that does nothing), everything
works fine.
If I do away with the year selector at the top of the page, the RequiredFieldValidators for the date TextBoxes think there is an entry when there is not but the CompareValidators think the dates are invalid because the watermark is shown in both.
To get around this, I replaced the year selection fields with a single do-nothing custom validator:
From this point, everything works. So my question is, why is this necessary? Is this a bug, or is there something I'm missing? As I stated earlier, if I don't use an UpdatePanel, everything works fine, but as soon as I add the UpdatePanel, it fails.
Marked as answer by desertfoxaz on Sep 11, 2012 06:07 PM
desertfoxaz
Member
307 Points
360 Posts
TextBoxWatermarkExtender text disappears upon validation inside update panel
Jun 13, 2012 05:38 PM|LINK
I have a webforms page in ASP.NET 4.0 where I have a panel control with some textboxes on it, some of which are used to capture dates. I am using the CalendarExtender to provide date picking functionality as well as a FilteredTextBoxExtender and MaskedEditExtender to ensure that only valid characters are entered and in the correct format.
The panel control is displayed only when the user clicks a link button and the date fields as well as a few other fields have RequiredFieldValidators associated with them. When I click the save button, which triggers the validation, I see the error messages displayed in the ValidationSummary, but the watermarks in the date fields disappear. I am using version 4.1.60501.0 of the AjaxControlToolkit. Is there any way to prevent this? If I don't use update panels this problem doesn't occur.
I tried this also in ASP.NET 3.5 with the AjaxControlToolkit version 3.0.20229.27839 and got the same behavior.
My code is below:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="DatePickerTest._Default" %> <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajax" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> <style type="text/css"> .row { clear: left; padding: 2px 0 2px 0; margin-left: 0; margin-right: 0; margin-top: 0; } .labelCol, .fieldCol { float: left; } .labelCol { width: 100px; } </style> </head> <body> <form id="form1" runat="server"> <ajax:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server" /> <asp:UpdatePanel ID="upDetail" runat="server" ChildrenAsTriggers="true" EnableViewState="true" RenderMode="Block" UpdateMode="Conditional"> <ContentTemplate> <asp:LinkButton ID="lbShowDetail" runat="server" CausesValidation="false" EnableViewState="true" OnClick="lbShowDetail_Click" Text="Show Detail" /> <asp:Panel ID="pnlDetail" runat="server" EnableViewState="false" GroupingText="Detail" Visible="false"> <div class="row"> <div class="labelCol"> <asp:Label ID="lblDescription" runat="server" AssociatedControlID="txtDescription" EnableViewState="false" Text="Description:" /> </div> <div class="fieldCol"> <asp:TextBox ID="txtDescription" runat="server" AutoCompleteType="Disabled" EnableViewState="false" /> <asp:RequiredFieldValidator ID="rfvDescription" runat="server" ControlToValidate="txtDescription" Display="Dynamic" EnableViewState="false" ErrorMessage="Description is required" SetFocusOnError="true" Text="*" ValidationGroup="Detail" /> </div> </div> <div class="row"> <div class="labelCol"> <asp:Label ID="lblStartDate" runat="server" AssociatedControlID="txtStartDate" EnableViewState="false" Text="Start Date:" /> </div> <div class="fieldCol"> <asp:TextBox ID="txtStartDate" runat="server" AutoCompleteType="Disabled" Columns="10" EnableViewState="false" MaxLength="10" /> <ajax:TextBoxWatermarkExtender ID="tbweStartDate" runat="server" TargetControlID="txtStartDate" WatermarkText="MM/DD/YYYY" /> <ajax:CalendarExtender ID="ceStartDate" runat="server" CssClass="ajax__calendar2" EnableViewState="false" Format="MM/dd/yyyy" TargetControlID="txtStartDate" /> <ajax:MaskedEditExtender ID="meeStartDate" runat="server" EnableViewState="false" Mask="99/99/9999" MaskType="Date" TargetControlID="txtStartDate" /> <asp:RequiredFieldValidator ID="rfvStartDate" runat="server" ControlToValidate="txtStartDate" Display="Dynamic" EnableViewState="false" ErrorMessage="Start Date is required" SetFocusOnError="true" Text="*" ValidationGroup="Detail" /> </div> </div> <div class="row"> <div class="labelCol"> <asp:Label ID="lblEndDate" runat="server" AssociatedControlID="txtEndDate" EnableViewState="false" Text="End Date:" /> </div> <div class="fieldCol"> <asp:TextBox ID="txtEndDate" runat="server" AutoCompleteType="Disabled" Columns="10" EnableViewState="false" MaxLength="10" /> <ajax:TextBoxWatermarkExtender ID="tbweEndDate" runat="server" TargetControlID="txtEndDate" WatermarkText="MM/DD/YYYY" /> <ajax:CalendarExtender ID="ceEndDate" runat="server" CssClass="ajax__calendar2" EnableViewState="false" Format="MM/dd/yyyy" TargetControlID="txtEndDate" /> <ajax:MaskedEditExtender ID="meeEndDate" runat="server" EnableViewState="false" Mask="99/99/9999" MaskType="Date" TargetControlID="txtEndDate" /> <asp:RequiredFieldValidator ID="rfvEndDate" runat="server" ControlToValidate="txtEndDate" Display="Dynamic" EnableViewState="false" ErrorMessage="End Date is required" SetFocusOnError="true" Text="*" ValidationGroup="Detail" /> </div> </div> <div class="row"> <div class="labelCol"> </div> <div class="fieldCol"> <asp:Button ID="btnSave" runat="server" CausesValidation="true" EnableViewState="false" Text="Save" OnClick="btnSave_Click" ValidationGroup="Detail" /> <asp:Button ID="btnCancel" runat="server" CausesValidation="false" EnableViewState="false" OnClick="btnCancel_Click" Text="Cancel" /> <asp:ValidationSummary ID="vsDetail" runat="server" DisplayMode="BulletList" EnableViewState="false" HeaderText="The following field(s) must be corrected:" ShowMessageBox="true" ShowSummary="false" ValidationGroup="Detail" /> </div> </div> </asp:Panel> </ContentTemplate> </asp:UpdatePanel> </form> </body> </html>using System; using System.Web.UI; namespace DatePickerTest { public partial class _Default : Page { protected void btnCancel_Click(object sender, EventArgs e) { txtDescription.Text = string.Empty; txtStartDate.Text = string.Empty; txtEndDate.Text = string.Empty; pnlDetail.Visible = false; lbShowDetail.Visible = true; } protected void btnSave_Click(object sender, EventArgs e) { } protected void lbShowDetail_Click(object sender, EventArgs e) { lbShowDetail.Visible = false; pnlDetail.Visible = true; } protected void Page_Load(object sender, EventArgs e) { } } }chetan.sarod...
All-Star
66619 Points
11270 Posts
Re: TextBoxWatermarkExtender text disappears upon validation inside update panel
Jun 14, 2012 03:50 AM|LINK
http://forums.asp.net/t/1179701.aspx/1
HTTP://blogs.msdn.with/mattgi/archive/2007/01/23/asp-net-ajax-validators.aspx
Senior Software Engineer,
Approva Systems Pvt Ltd, Pune, India.
desertfoxaz
Member
307 Points
360 Posts
Re: TextBoxWatermarkExtender text disappears upon validation inside update panel
Jun 22, 2012 03:48 PM|LINK
That doesn't work. If I put an update panel within the <body> tag and all my content within the update panel, I still have this problem. If I do without the update panel completely, it works. However, I need to use AJAX here.
By the way, your second link doesn't work.
desertfoxaz
Member
307 Points
360 Posts
Re: TextBoxWatermarkExtender text disappears upon validation inside update panel
Jun 27, 2012 04:31 PM|LINK
My original post was slightly wrong. I am not using a FilteredTextBoxExtender, I am using a TextBoxWatermarkExtender. The problem is if I put the controls within the UpdatePanel, when I click the submit button, the Mask disappears from the date textboxes (they are blank).
Another thing that I noticed is that if I put RequiredFieldValidators on those textboxes, the validation that occurs thinks the textboxes have values even though nothing was entered by the user.
If I don't use an UpdatePanel, everything works as expected.
My updated markup is like this:
Is there any reason why this doesn't work inside an update panel? We have been using this "date picker" in a lot of our other applications but this is the first time that these controls have been placed inside an UpdatePanel.
desertfoxaz
Member
307 Points
360 Posts
Re: TextBoxWatermarkExtender text disappears upon validation inside update panel
Jun 29, 2012 05:49 PM|LINK
I have another page in the same application that doesn't have this problem so I copied the code from that page into the one that doesn't work, and then started changing it piece by piece until the content approximated what the page had originally.
What appears to be the problem is that in the page that works, I have a DropDownList with a RequiredFieldValidator attached to it and a button that triggers the validation. If the validation passes, the hidden Panel, which is in the UpdatePanel, is shown. That's where my date TextBoxes are. Since the DropdownList which requires a selection wasn't needed for this page, I removed it and that's when it stopped working. If I add another validator (in this case a custom validator that does nothing), everything works fine.
Here's my basic layout of the page:
If I do away with the year selector at the top of the page, the RequiredFieldValidators for the date TextBoxes think there is an entry when there is not but the CompareValidators think the dates are invalid because the watermark is shown in both.
To get around this, I replaced the year selection fields with a single do-nothing custom validator:
From this point, everything works. So my question is, why is this necessary? Is this a bug, or is there something I'm missing? As I stated earlier, if I don't use an UpdatePanel, everything works fine, but as soon as I add the UpdatePanel, it fails.