RadMaskedTextBox uses a mask to distinguish between proper and improper user input. The RadMaskedTextBox control is an enhanced TextBox control that supports a declarative syntax for accepting or rejecting user input. Using the Mask property, you can specify the following input without writing any custom validation logic in your application:
- Required input characters.
- Optional input characters.
- The type of input expected at a given position in the mask; for example, a digit, or an alphabetic or alphanumeric character.
- Mask literals, or characters that should appear directly in the RadMaskedTextBox; for example, the hyphens (-) in a phone number, or the currency symbol in a price.
When a RadMaskedTextBox control is displayed at run time, it represents the mask as a series of prompt characters and optional literal characters. Each editable mask position, representing a required or optional input, is shown with a single placeholder character. For example, the number sing (#) is often used as a placeholder for a numeric character input. You can use the Placeholder property to specify a custom placeholder character. The EmptyContent property could be used to determine what will be displayed when the user specifies a null value and the control loses input focus.
As the user types input into the RadMaskedTextBox, valid input characters replace their respective placeholder characters in a sequential fashion. If the user types an invalid input character, no replacement occurs. You can provide your own custom error by handling the ValueChanging or/and ValueChanged events.
You can use the Value property, to get the user input without the formatted characters. The MaskedText property will always retreive the user's input formatted according to the mask and the MaskType property.
Masks do not necessarily guarantee that a user's input will represent a valid value for a given type; for example, -9 could be entered for an age in years. You can verify that a user's input represents a valid value by taking advantage of the RadMaskedTextBox's built in support for Silverlight Validation.
This tutorial will walk you through the creation of a RadMaskedTextBox and will show you how to:
Declare RadMaskedTextBox
 Note |
|---|
In order to use RadMaskedTextBox control in your projects you have to add references to the following assemblies: - Telerik.Windows.Controls
- Telerik.Windows.Controls.Input
You can find more info here. |
After adding references to the aforementioned dlls, you can declare a new RadMaskedTextBox as any normal Silverlight/WPF control.
CopyXAML
<UserControl .....
xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation">
<Grid x:Name="LayoutRoot"
Background="White">
<telerik:RadMaskedTextBox x:Name="radMaskedTextBox" />
</Grid>
</UserControl>Set MaskType and Mask Properties
The most significant properties of the RadMaskedTextBox are:
- MaskType - this property determines how masks are interpreted by the control. Valid values are None, Standard, DateTime and Numeric. When property is set to None, the control acts as a TextBox. By using the StandardMaskType you can define custom alpha or numeric masks. The DateTimeMaskType allows you to define predefined or custom date and time masks. The NumericMaskType is used when you need to display percent, decimal, currency (culture-aware) or fixed point values.
- Mask - a string of characters that constrains user input. The Mask property may contain literals and special mask characters. The MaskType determines how the mask characters are interpreted. You can use the back slash (\) character to escape any special mask characters so that they are displayed as literals.
The following code example initializes the RadMaskedTextBox to accept a date in a long date format.
CopyXAML
<telerik:RadMaskedTextBox x:Name="radMaskedTextBox"
MaskType="DateTime"
Mask="D"/>Change the Default Placeholder Character
The Placeholder property represents the character displayed in any blank space defined by a Mask character. By default the character is an underscore (_).
CopyXAML
<telerik:RadMaskedTextBox x:Name="radMaskedTextBox"
Placeholder="$"/>Change the Culture
The Culture property allows you to set the current language and culture from a drop-down list at design-time or to assign a new CultureInfo instance at run-time.
The following code example initializes the RadMaskedTextBox to accept a Bulgarian date in a long date format.
CopyXAML
<telerik:RadMaskedTextBox x:Name="radMaskedTextBox"
MaskType="DateTime"
Mask="D"
Culture="bg-BG"/>| Tip |
|---|
For more information check out the following topics: |
Set Watermark
You can set a watermark content to the RadMaskedTextBox by using the EmptyContent and EmptyContentTemplate properties. When the Value of the RadMaskedTextBox is null or empty the EmptyContent will be displayed.
CopyXAML
<telerik:RadMaskedTextBox x:Name="radMaskedTextBox"
MaskType="Standard"
Mask="####"
EmptyContent="Enter four digits number"/>See Also