CODEWITHSUNDEEP
wpfdatepicker
Robin
Robin

Reputation: 2328

DatePicker doesn't update view model unless focus changes to another control

How can I make the DatePicker control update the view model without losing focus?

I'd like to be able to run this sample, type 12/9/11 for the date, click the close button for the window and have the Debug.Assert pass. If I tab to the text box before closing the window it works fine.

<Window x:Class="DatePickerTest.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525" Closing="MainWindow_OnClosing">
    <StackPanel>
        <DatePicker Name="TheDate" SelectedDate="{Binding Path=SelectedDate}" />
        <TextBox/>
    </StackPanel>
</Window>

using System;
using System.ComponentModel;
using System.Diagnostics;

namespace DatePickerTest
{
   public partial class MainWindow
   {
      public MainWindow()
      {
         InitializeComponent();
         DataContext = new ViewModel();
      }

      private void MainWindow_OnClosing(object sender, CancelEventArgs e)
      {
         var dataContext = DataContext as ViewModel;
         Debug.Assert(dataContext.SelectedDate == new DateTime(2011, 12, 9));
      }
   }

   public class ViewModel
   {
      public DateTime SelectedDate { get; set; }
   }

}

Upvotes: 2

Views: 8307

Answers (2)

Laila
Laila

Reputation: 53

Try this:

public class CustomDatePicker : DatePicker
{
    protected DatePickerTextBox _datePickerTextBox;

    public static readonly new DependencyProperty SelectedDateProperty =
        DependencyProperty.Register(nameof(SelectedDate), typeof(DateTime?), typeof(CustomDatePicker), 
            new FrameworkPropertyMetadata(null, SelectedDateChanged) { BindsTwoWayByDefault = true });

    private static new void SelectedDateChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
    {
        ((CustomDatePicker)d).SelectedDate = (DateTime?)e.NewValue;
    }

    public new DateTime? SelectedDate
    {
        get { return (DateTime?)GetValue(SelectedDateProperty); }
        set
        {
            if (base.SelectedDate != value) base.SelectedDate = value;
            if (this.SelectedDate != value) SetValue(SelectedDateProperty, value);
        }
    }

    public override void OnApplyTemplate()
    {
        base.OnApplyTemplate();

        _datePickerTextBox = this.Template.FindName("PART_TextBox", this) as DatePickerTextBox;
        if (_datePickerTextBox != null)
            _datePickerTextBox.TextChanged += dptb_TextChanged;
    }

    private void dptb_TextChanged(object sender, TextChangedEventArgs e)
    {
        int index = _datePickerTextBox.SelectionStart;
        string text = _datePickerTextBox.Text;

        DateTime dt;
        if (DateTime.TryParse(_datePickerTextBox.Text, Thread.CurrentThread.CurrentCulture,
            System.Globalization.DateTimeStyles.None, out dt))
            this.SelectedDate = dt;
        else
            this.SelectedDate = null;

        _datePickerTextBox.Text = text;
        _datePickerTextBox.SelectionStart = index;
    }
}

It's an improved version of what I found here. It updates the SelectedDate as the user types.

Upvotes: 4

devdigital
devdigital

Reputation: 34369

Try changing the UpdateSourceTrigger to PropertyChanged, e.g.

<DatePicker Name="TheDate" 
            SelectedDate="{Binding Path=SelectedDate
                 , UpdateSourceTrigger=PropertyChanged
                 , Mode=TwoWay}" />

Update

Ok, it seems as though this is a known issue with the DatePicker. You can bind to the Text property instead, and set a TargetNullValue:

<DatePicker
   Name="TheDate"
   Text="{Binding Path=SelectedDate
          , Mode=TwoWay
          , UpdateSourceTrigger=PropertyChanged
          , ValidatesOnDataErrors=True
          , TargetNullValue=''}"
/>

Upvotes: 11

Related Questions