#1,039 – Intercepting Bad Date Strings Entered into a DatePicker

When a user manually enters a date into a DatePicker, the DatePicker control automatically checks to see whether what they entered is a valid date.  If the date is valid, it’s converted to the proper display format and the DatePicker’s SelectedDate property is set.

If the date is not valid, the DatePicker by automatically reverts to the last valid string contained in this field, or to an empty string.

You can react to the user entering an invalid date by handling the DateValidationError event.

For example, if we have a bindable string property ErrorMessage, we can do the following:

        <Label Content="Pick a date:" Margin="5"/>
        <DatePicker Margin="5,0,5,5"
                    DateValidationError="DatePicker_DateValidationError"
                    SelectedDateChanged="DatePicker_SelectedDateChanged"/>
        <TextBlock Margin="5" Text="{Binding ErrorMessage}"
                   Foreground="Red"
                   TextWrapping="Wrap"/>

Code-behind:

        private void DatePicker_DateValidationError(object sender, DatePickerDateValidationErrorEventArgs e)
        {
            ErrorMessage = e.Exception.Message;
        }

        private void DatePicker_SelectedDateChanged(object sender, System.Windows.Controls.SelectionChangedEventArgs e)
        {
            ErrorMessage = "";
        }

1039-001
1039-002

Advertisement

#1,038 – Another Way to Prevent Certain Dates from Being Selected

You can limit the dates available for selection in a Calendar or DatePicker control in a few different ways.

If you want to prohibit some combination of dates, but have to do some calculation to figure out which dates should be prohibited, you can add a handler for the SelectedDateChanged event.

        <Label Content="Pick a day to go skydiving:"
               Margin="5"/>
        <DatePicker Margin="5,0,5,5"
                    SelectedDateChanged="DatePicker_SelectedDateChanged" />

In the handler, if the selected date is not one that you allow, you can undo the fact that it was selected.

        private void DatePicker_SelectedDateChanged(object sender, System.Windows.Controls.SelectionChangedEventArgs e)
        {
            if (e.AddedItems.Count > 0)
            {
                DateTime dayToDive = (DateTime)e.AddedItems[0];
                if ((dayToDive.DayOfWeek == DayOfWeek.Friday) &&
                    (dayToDive.Day == 13))
                {
                    MessageBox.Show("Dude, that's really an unlucky day to go skydiving.");
                    ((DatePicker)sender).SelectedDate = null;
                }
            }
        }

If we pick a Friday the 13th, the application warns us and then unselects the date.
1038-001

 

1038-002

#1,037 – Entering Text Manually into a DatePicker

When using a DatePicker control, you can either use the dropdown calendar to select a date or you can manually enter a date in the text area.

1037-001

 

When the DatePicker converts the string that you enter into a date, it uses the DateTime.Parse method, which in turn uses the valid date/time formats for your current culture to convert from a string to a date.

For example, if you set the SelectedDateFormat to Long (so that the long form of the date is displayed) and then enter “1/10/13” when in the U.S., the date is interpreted as January 10, 2013.  This is because the normal short date format is month/day/year.  (Note that SelectedDateFormat only dictates how the date is displayed–you can still enter it using the short format).

1037-002

 

However, if you enter “1/10/13” and your regional settings are set to French/France, the date will be interpreted as October 1, 2013.  This is because the short date format in France is day/month/year.

1037-003

#1,036 – Date Formats in the DatePicker Control

You can set the format of the date displayed in the text area of a DatePicker by setting the SelectedDateFormat property to either Short or Long.  These formats correspond to the “short date” and “long date” formats associated with the current culture.  You can see these format strings in the Region dialog.  For example, for English/U.S. they are:

  • Short – “M/d/yyyy” 
  • Long – “dddd, MMMM d, yyyy” 

Where

  • M = Month, 1-12
  • d = Day of month, 1-31
  • yyyy = 4-digit year
  • dddd = Day of week, full name
  • MMMM = Month, full name

1036-001

So, for English/U.S., if we select March 18, 2014 as the date, we see the date displayed as one of the following strings:

  • Short – “3/18/2014”
  • Long – “Tuesday, March 18, 2014”

1036-002

 

 

 

#1,035 – DatePicker Basics

The DatePicker is a control that operates like the Calendar control, allowing the user to select a date, but does so in a dropdown calendar that appears when the user clicks on a calendar icon in the control.  Unlike the Calendar control, the DatePicker allows selecting only a single date.

    <StackPanel>
        <Label Content="Calendar:"/>
        <Calendar />

        <Label Content="DatePicker:" Margin="0,10,0,0"/>
        <DatePicker Margin="5,0"/>
    </StackPanel>

The DatePicker looks a bit like a TextBox, with an area to enter some text and a calendar icon to the right.

1035-001

If you click on the calendar icon in the DatePicker, a calendar appears as a popup, allowing selection of a date.

1035-002

Once you select a date, the date is then displayed in the text area.

1035-003

You can also type a date manually into the text area of the DatePicker.

1035-004