CBreeze
CBreeze

Reputation: 2973

Format DataGrid Column as User is Typing

I have a DataGrid where on of the columns is a simple DataGridTextColumn. What I would like to do is as the user is typing into the row in the DataGrid, only allow them to enter a specific format, in this case dd/MM/yyyy. I shall enter the / / for them, then they have to type in a date that fits this format.

This is my DataGridColumn;

<DataGridTextColumn Header="Date" Width="*"/>

Is there a way to format the Column as the user is typing?

Upvotes: 1

Views: 1046

Answers (1)

StepUp
StepUp

Reputation: 38154

There is no built-in MaskedTextBox in WPF. However, you can use MaskedTextBox or DateTimePicker from Extended WPF Toolkit.

I would like to show a DateTimePicker from Extended WPF Toolkit and MaskedTextBox. enter image description here

Update:

Sure, you can add DateTimePicker to DataGrid

At first, download Extended WPF ToolKit through Nuget.

Then, create pseudonym in xmlns to use the WPF Extended Toolkit library:

<Window
...
xmlns:wpfTool="clr-namespace:Xceed.Wpf.Toolkit;assembly=Xceed.Wpf.Toolkit"
    mc:Ignorable="d"
    Title="MainWindow" Height="350" Width="525">
<Window.DataContext>
   <vm:MainWindowViewModel/>
</Window.DataContext>
<Grid>        
    <DataGrid ItemsSource="{Binding Persons}" AutoGenerateColumns="False">
        <DataGrid.Columns>
            <DataGridTextColumn Header="ID" Binding="{Binding IdPerson}"/>
            <DataGridTextColumn Header="Name" Binding="{Binding Name}"/>                                
            <DataGridTemplateColumn>
                <DataGridTemplateColumn.CellTemplate>
                   <DataTemplate>                           
                            <wpfTool:DateTimePicker Value="{Binding MyDate}"/>
                        </DataTemplate>
                </DataGridTemplateColumn.CellTemplate>                    
            </DataGridTemplateColumn>                
        </DataGrid.Columns>
    </DataGrid>
</Window>

and model class:

public class Person
{
    public int IdPerson { get; set; }
    public string Name { get; set; }
    public DateTime FirstDate { get; set; }
}

OR:

Just use MaskedTextBox with Mask="00-00-0000" from WPF Extended Toolkit. For example:

<DataGrid ItemsSource="{Binding Persons}" AutoGenerateColumns="False">
  <DataGrid.Columns>
    <DataGridTextColumn Header="ID" Binding="{Binding IdPerson}"/>
    <DataGridTextColumn Header="Name" Binding="{Binding Name}"/>                                
    <DataGridTemplateColumn>
       <DataGridTemplateColumn.CellTemplate>
          <DataTemplate>                                 
             <wpfTool:MaskedTextBox Mask="00-00-0000" Text="{Binding CheckDateTime}"/>                           
          </DataTemplate>
       </DataGridTemplateColumn.CellTemplate>                    
     </DataGridTemplateColumn>                
  </DataGrid.Columns>
</DataGrid>

and then parse CheckDateTime by DateTime.ParseExact(...);

Upvotes: 1

Related Questions