在不支持的日期格式下使用CompareValidator和CalenderExtender

Question

我在表單中有一個開始日期和結束日期字段。我爲日曆擴展程序指定了格式。從那以後，比較驗證器不工作。它總是顯示錯誤信息。請幫忙。我需要以「2012年5月4日星期五」格式顯示日期。

開始日期字段：

<asp:TextBox ID="txtStartDate" ReadOnly="true" runat="server" 
    CssClass="textBoxWidth TPRValue" Text='<%#DataBinder.Eval(Container.DataItem, "StartDate", "{0: ddd MM dd, yyyy}")%>'> 
</asp:TextBox> 
<asp:ImageButton ID="imgBtnStartDate" runat="server" ImageUrl="~/Common/Images/Calendar.GIF" CausesValidation="false" ImageAlign="AbsMiddle" /> 
<ajax:CalendarExtender ID="StartDateCalendar" TargetControlID="txtStartDate" PopupButtonID="imgBtnStartDate" runat="server" 
    Format="ddd MM dd, yyyy"> 
</ajax:CalendarExtender> 
<asp:CompareValidator ID="startDateCompareValidator" runat="server" ControlToValidate="txtStartDate" ControlToCompare="txtEndDate" Enabled="true" 
    Type="Date" Display="Dynamic" Operator="LessThanEqual" 
    Text="Startdate should be <= enddate"> 
</asp:CompareValidator> 

結束日期字段：

<asp:TextBox ID="txtEndDate" ReadOnly="true" runat="server" 
    CssClass="textBoxWidth TPRValue" Text='<%#DataBinder.Eval(Container.DataItem, "EndDate", "{0: ddd MM dd, yyyy}")%>'> 
</asp:TextBox> 
<asp:ImageButton ID="imgBtnEndDate" runat="server" ImageUrl="~/Common/Images/Calendar.GIF" CausesValidation="false" ImageAlign="AbsMiddle" /> 
<ajax:CalendarExtender ID="EndDateCalendar" TargetControlID="txtEndDate" PopupButtonID="imgBtnEndDate" runat="server" 
    Format="ddd MM dd, yyyy"> 
</ajax:CalendarExtender> 

比較驗證：

<asp:CompareValidator ID="startDateCompareValidator" runat="server" ControlToValidate="txtStartDate" 
    ControlToCompare="txtEndDate" Enabled="true" Type="Date" Display="Dynamic" Operator="LessThanEqual" 
    Text="Startdate should be <= enddate"> 
</asp:CompareValidator> 

Answer 1

我假設CompareValidator不接受您的格式。

CompareValidator是相當特別的日期，它會接受。例如，下列日期被視爲無效：

• 2001年1月1日
• 2001年1月1日
• 週五2012

5月4日的CompareValidator需要看起來像這樣的日期：

• 1/1/2001
• 2001年1月1日
• 5/4/2012

http://www.informit.com/articles/article.aspx?p=25461&seqNum=5

無需測試它，你可以嘗試使用隱藏的文本框（display:none）所接受的日期格式爲文本。然後將驗證器的ControlToValidate設置爲「隱藏字段」。您需要將兩個文本框的文本屬性與其隱藏域進行同步。也許這給你一個想法。

編輯：好吧，我試圖得到它的工作我說的話，實際上它是工作:) 也許有一些重構可能的，但有一個看你自己。

要隱藏與工作的日期格式文本框我使用CSS：

<style type="text/css"> 
    .hidden 
    { 
     display:none; 
    } 
</style> 

這些JS-函數被調用，當用戶更改通過CalendarExtenders日期：

<script type="text/javascript"> 
    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; 
    } 
</script> 

這是示例頁面的其餘部分：

<div> 
    <asp:TextBox ID="txtStartDate" CausesValidation="false" ReadOnly="true" runat="server"> 
    </asp:TextBox> 
    <asp:TextBox ID="txtStartDateHidden" CssClass="hidden" ValidationGroup="DateCheck" CausesValidation="true" ReadOnly="false" runat="server"> 
    </asp:TextBox> 
    <ajax:CalendarExtender ID="StartDateCalendar" TargetControlID="txtStartDate" runat="server" 
     OnClientDateSelectionChanged="dateChangedStart" 
     Format="ddd MM dd, yyyy"> 
    </ajax:CalendarExtender> 
    <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 <= enddate"> 
    </asp:CompareValidator> 
    <asp:TextBox ID="TxtEndDate" CausesValidation="false" ReadOnly="true" runat="server"> 
    </asp:TextBox> 
    <asp:TextBox ID="txtEndDateHidden" CssClass="hidden" ValidationGroup="DateCheck" CausesValidation="true" ReadOnly="false" runat="server"> 
    </asp:TextBox> 
    <ajax:CalendarExtender ID="EndDateCalendar" TargetControlID="txtEndDate" runat="server" 
     OnClientDateSelectionChanged="dateChangedEnd" 
     Format="ddd MM dd, yyyy"> 
    </ajax:CalendarExtender> 
    <asp:Button ID="BtnSubmit" CausesValidation="true" ValidationGroup="DateCheck" runat="server" Text="Submit" /> 
</div> 

Answer 2

除了Tim的回答，對於那些想要使用jQuery：

function dateChangedStart(sender, args) { 
    var selectedDate = sender.get_selectedDate(); 
    var hiddenStart = $('input[id$=txtStartDateHidden]'); 
    var validator = $('span[id$=startDateCompareValidator]'); 
    hiddenStart.val(dateToString(selectedDate)); 

    var validatorAsDOM = validator.get(0); 
    ValidatorValidate(validatorAsDOM); 
} 

Answer 3

對於日期格式MM/DD/YYYY

把這個網站。配置

<globalization culture="en-us"/> 

<system.web>