Using a masked text box

The following example demonstrates how to use the MaskedTextBox control outside a grid to allow a user to input a fictitious identity number. The foreground color of the masked text box will change from red when it contains invalid text (HasParsingError), to blue when all required characters have been inputted (IsMaskCompleted), to green when all characters, required and optional, have been inputted (IsMaskFull).

XAML	Copy Code
<Grid xmlns:xcdg="http://schemas.xceed.com/wpf/xaml/datagrid" xmlns:s="clr-namespace:System;assembly=mscorlib"> <Grid.Resources> <Style TargetType="{x:Type xcdg:MaskedTextBox}"> <Style.Triggers> <Trigger Property="HasParsingError" Value="True"> <Setter Property="Foreground" Value="Red" /> </Trigger> <Trigger Property="IsMaskCompleted" Value="True"> <Setter Property="Foreground" Value="Blue" /> </Trigger> <Trigger Property="IsMaskFull" Value="True"> <Setter Property="Foreground" Value="Green" /> </Trigger> </Style.Triggers> </Style> </Grid.Resources> <xcdg:MaskedTextBox Mask=">LLLL 000000 ??" PromptChar="-" AllowPromptAsInput="True" ResetOnPrompt="True" ResetOnSpace="True" Height="Auto"/> </Grid>

XAML

Copy Code

<Grid xmlns:xcdg="http://schemas.xceed.com/wpf/xaml/datagrid"

      xmlns:s="clr-namespace:System;assembly=mscorlib">

  <Grid.Resources> 

<Style TargetType="{x:Type xcdg:MaskedTextBox}">

      <Style.Triggers>

         <Trigger Property="HasParsingError" Value="True">

            <Setter Property="Foreground" Value="Red" />

         </Trigger>

         <Trigger Property="IsMaskCompleted" Value="True">

           <Setter Property="Foreground" Value="Blue" />

        </Trigger>

      

        <Trigger Property="IsMaskFull" Value="True">

           <Setter Property="Foreground" Value="Green" />

        </Trigger>

     </Style.Triggers>

  </Style>

  </Grid.Resources>

    <xcdg:MaskedTextBox Mask=">LLLL 000000 ??"

                        PromptChar="-"

                        AllowPromptAsInput="True"

                        ResetOnPrompt="True"

                        ResetOnSpace="True"

                        Height="Auto"/>

  </Grid>