Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>I assume that the <code>CompareValidator</code> does not accept your format.</p> <p>The CompareValidator is pretty particular about the dates that it will accept. For example, the following dates are not considered valid:</p> <ul> <li>January 1, 2001</li> <li>Jan 1, 2001</li> <li>Fri 04 May 2012</li> </ul> <p>The CompareValidator requires a date that looks like this:</p> <ul> <li>1/1/2001</li> <li>1-1-2001</li> <li>5/4/2012</li> </ul> <p><a href="http://www.informit.com/articles/article.aspx?p=25461&amp;seqNum=5" rel="nofollow">http://www.informit.com/articles/article.aspx?p=25461&amp;seqNum=5</a></p> <p>Without having tested it, you could try to use a hidden TextBox(<code>display:none</code>) with the accepted date format as Text. Then set the Validator's <code>ControlToValidate</code> to the "hiddenfield". You need to synchronize both TextBoxes' Text properties with their hiddenfields. Maybe this gives you an idea. </p> <p><strong>Edit</strong>: Ok, i've tried to get it working what i've said and actually it is working :) Maybe there's some refactoring possible, but have a look yourself.</p> <p>To hide the TextBox with the working date format i've used CSS:</p> <pre><code>&lt;style type="text/css"&gt; .hidden { display:none; } &lt;/style&gt; </code></pre> <p>These JS-functions are called when the user changes a date via CalendarExtenders:</p> <pre><code>&lt;script type="text/javascript"&gt; function dateChangedStart(sender, args) { var selectedDate = sender.get_selectedDate(); var hiddenStart = $get("txtStartDateHidden"); var validator = $get("startDateCompareValidator"); hiddenStart.value = dateToString(selectedDate); ValidatorValidate(validator); } function dateChangedEnd(sender, args) { var selectedDate = sender.get_selectedDate(); var hiddenEnd = $get("txtEndDateHidden"); var validator = $get("startDateCompareValidator"); hiddenEnd.value = dateToString(selectedDate); ValidatorValidate(validator); } function dateToString(d) { var year = d.getFullYear(); var month = d.getMonth() + 1; //months are zero based var day = d.getDate(); return year + "/" + month + "/" + day; } &lt;/script&gt; </code></pre> <p>This is the rest of the sample page:</p> <pre><code>&lt;div&gt; &lt;asp:TextBox ID="txtStartDate" CausesValidation="false" ReadOnly="true" runat="server"&gt; &lt;/asp:TextBox&gt; &lt;asp:TextBox ID="txtStartDateHidden" CssClass="hidden" ValidationGroup="DateCheck" CausesValidation="true" ReadOnly="false" runat="server"&gt; &lt;/asp:TextBox&gt; &lt;ajax:CalendarExtender ID="StartDateCalendar" TargetControlID="txtStartDate" runat="server" OnClientDateSelectionChanged="dateChangedStart" Format="ddd MM dd, yyyy"&gt; &lt;/ajax:CalendarExtender&gt; &lt;asp:CompareValidator ID="startDateCompareValidator" runat="server" EnableClientScript="true" ControlToValidate="txtStartDateHidden" Display="Static" Operator="LessThanEqual" ValidationGroup="DateCheck" ControlToCompare="txtEndDateHidden" Enabled="true" Type="Date" Text="Startdate should be &lt;= enddate"&gt; &lt;/asp:CompareValidator&gt; &lt;asp:TextBox ID="TxtEndDate" CausesValidation="false" ReadOnly="true" runat="server"&gt; &lt;/asp:TextBox&gt; &lt;asp:TextBox ID="txtEndDateHidden" CssClass="hidden" ValidationGroup="DateCheck" CausesValidation="true" ReadOnly="false" runat="server"&gt; &lt;/asp:TextBox&gt; &lt;ajax:CalendarExtender ID="EndDateCalendar" TargetControlID="txtEndDate" runat="server" OnClientDateSelectionChanged="dateChangedEnd" Format="ddd MM dd, yyyy"&gt; &lt;/ajax:CalendarExtender&gt; &lt;asp:Button ID="BtnSubmit" CausesValidation="true" ValidationGroup="DateCheck" runat="server" Text="Submit" /&gt; &lt;/div&gt; </code></pre>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload