wpfwpfdatagriddatagridtemplatecolumn

DataGridTemplateColumn with DatePicker requires three clicks to edit the date


I have a DataGridTemplateColumn. Inside its CellEditingTemplate, I put a DatePicker control. Now if I want to edit the date, I have to click three times to let DatePicker begin editing. Can someone let me know how I can get DatePicker into edit mode with only two clicks? Also, if DataGridTemplateColumn get focused, keyboard typing doesn't put DatePicker into edit mode as well. It would be nice if it can be fixed as well.


Solution

  • You have to override the PrepareCellForEdit in DataGridTemplateColumn as follows:

    public class DataGridDateColumn:DataGridTemplateColumn
    {
        protected override object PrepareCellForEdit(FrameworkElement editingElement,
                                                     RoutedEventArgs editingEventArgs)
        {
            editingElement.MoveFocus(new TraversalRequest(FocusNavigationDirection.First));
            return base.PrepareCellForEdit(editingElement, editingEventArgs);
        } 
    }
    

    XAML

    <Custom:DataGrid x:Name="dgData" SelectionUnit="Cell" AutoGenerateColumns="False" CanUserAddRows="False">
        <Custom:DataGrid.Columns>
            <Custom:DataGridTextColumn Binding="{Binding Subject}" Header="Subject" Width="*"/>
            <Custom:DataGridTextColumn Binding="{Binding RaisedBy}" Header="Raised By" Width="100"/>
    
            <DatePickerDGWPF:DataGridDateColumn Header="Raised On" Width="250">
                <DatePickerDGWPF:DataGridDateColumn.CellTemplate>
                    <DataTemplate>
                        <TextBlock Text="{Binding RaisedOn}" />
                    </DataTemplate>
                </DatePickerDGWPF:DataGridDateColumn.CellTemplate>
                <DatePickerDGWPF:DataGridDateColumn.CellEditingTemplate>
                    <DataTemplate>
                        <Custom:DatePicker SelectedDate="{Binding RaisedOn}"/>       
                    </DataTemplate>
                </DatePickerDGWPF:DataGridDateColumn.CellEditingTemplate>
            </DatePickerDGWPF:DataGridDateColumn>
        </Custom:DataGrid.Columns>
    </Custom:DataGrid>