How to use Ajax MaskedEdit with certain date format?

GLP picture GLP · Mar 8, 2012 · Viewed 14.7k times · Source

We have a text box, where the user can input date. The only valid date allowed is MM/dd/yyyy. After going through all the trouble, I think MaskedEditExtender is the best choice. But I have some problems using it. Following is my ASPX code,

<div>
    Date: <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
    <asp:MaskedEditExtender ID="TextBox1_MaskedEditExtender" runat="server" 
        CultureAMPMPlaceholder="" CultureCurrencySymbolPlaceholder="" 
        CultureDateFormat="" CultureDatePlaceholder="" CultureDecimalPlaceholder="" 
        CultureThousandsPlaceholder="" CultureTimePlaceholder="" Enabled="True" 
        Mask="99/99/9999" MaskType="Date" TargetControlID="TextBox1">
    </asp:MaskedEditExtender>
    <asp:CalendarExtender ID="TextBox1_CalendarExtender" runat="server" 
        Enabled="True" TargetControlID="TextBox1" Format="MM/dd/yyyy">
    </asp:CalendarExtender>         
</div>

Here are my questions:

  1. After I added the MaskedEditExtender, when I pick up a date from calendar, it won't write to the text box.
  2. When I type some date in the text box, it will become 01-01-2011, not 01/01/2011, which is what I want.
  3. Should I use CompareValidator or MaskedEditValidator? Since I want to make sure the date like 02/29/2011 is not valid.

Answer

Koste picture Koste · Mar 9, 2012

Your code is correct. I try it on my own and everything works perfect.

So, I suggest you to try this code on a separate project solution to see if there is any other problem.

About 3th question, probably you need to use MaskedEditValidator if you need to validate the inserted date. You should use CompareValidator if you need to compare some dates for example.

Here is a good example of using MaskedEditValidator:

<ajaxToolkit:MaskedEditValidator ID="MV_Date" runat="server" ControlToValidate="TextBox1"
            ControlExtender="TextBox1_MaskedEditExtender" InvalidValueMessage="Invalid Date"
            IsValidEmpty="False" />