Telerik UI for Silverlight

Important

Due to the many known limitations of the current implementation of the RadMaskedTextBox control we will no longer ship it with the Q2 2014 release of RadControls for WPF and Silverlight. We strongly encourage all existing and new users to use RadMaskedInput suite of controls instead.

Properties

The most significant properties of RadMaskedTextBox are:

  • MaskType: This property determines how masks are interpreted by the control. Valid values are None, Standard and DateTime. When the property is set to None, the control acts as a TextBox. By using the Standard MaskType you can define custom alpha or numeric masks. The DateTime MaskType allows you to define predefined or custom date and time masks.
  • Mask: A string of characters that constrain user input. The Mask property may contain literals and special mask characters (see the topics for Standard and Date/Time masks for specifics). The MaskType determines how the mask characters are interpreted. Use the back slash "\" character to escape any mask characters so that they are displayed as literals. At runtime, any blank space occupied by a Mask character is displayed as the PlaceHolder property character.
  • PlaceHolder: This property represents the character displayed in any blank space defined by a Mask character. By default the character is an underscore "_".
MaskType and Mask Examples:
MaskTypeMaskUser InputDisplayed As/Example
Standard\# ###12# 12_
Standard###-##-####1234123-4_-____
Standardaaaaa-aaaaa-aaaaa-aaaaaabc123abc12-3____-_____-_____
DateTimed1 1 200701/01/2007
DateTimeMMM ddNavigate with arrow keysDec 1
  • Culture: This 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.

CopyC#
RadMaskedTextBox maskedTextBox = new RadMaskedTextBox();
maskedTextBox.MaskType = MaskType.DateTime;
maskedTextBox.Mask = "D";
maskedTextBox.Culture = new System.Globalization.CultureInfo("de-DE");
CopyVB.NET
Dim maskedTextBox As New RadMaskedTextBox()
maskedTextBox.MaskType = MaskType.DateTime
maskedTextBox.Mask = "D"
maskedTextBox.Culture = New System.Globalization.CultureInfo("de-DE")

  • Value: This property returns user input without the formatting characters. If you want the input and the formatting characters, use the MaskedText property.
  • Empty Content:You can use the EmptyContent property to specify what will be displayed when the Value is null.
    CopyXAML
    <telerik:RadMaskedTextBox EmptyContent="Enter digits only" 
                              Mask="999"
                              MaskType="Standard" />
    <telerik:RadMaskedTextBox EmptyContent="Empty None Mask" MaskType="None" />
  • IsSpinEnabled: If you want to disable/enable the spinning behavior of RadMaskedTextBox you can use IsSpinEnabled. By default this property is set to true. Note that only Numeric and DateTime MaskTypes support spinning.
    CopyXAML
    <telerik:RadMaskedTextBox EmptyContent="Enter digits only" 
                              IsSpinEnabled="False"
                              Mask="n"
                              MaskType="Numeric" />
    <telerik:RadMaskedTextBox EmptyContent="Enter digits only" 
                              IsSpinEnabled="False"
                              Mask="D"
                              MaskType="DateTime" />

This means that you are not able to increase/decrease the value with the arow keys or the mouse wheel.

Events

RadMaskedTextBox allows you to handle ValueChanging and ValueChanged events. Examine the MaskedText and Value properties to determine user entry with a mask and without a mask, respectively. ValueChanging also passes a RoutedEventArgs parameter containing a Handled property. When Handled is set to true the value is not allowed to change.

Use the ValueChanging event to preview and prevent the value from changing.

  • ValueChanging : Occurs before the value is changed.
  • ValueChanged : Occurs when the value is changed.

DataBinding

The purpose of this section is to show you how to populate RadMaskedTextBox with data . It will guide you how to bind a RadMaskedTextBox to a collection of business objects.

At first Create a new class named DataClass. This class has StringValue, DoubleValue, IntValue and DatetimeValue properties.

CopyC#
public class DataClass : INotifyPropertyChanged
    {
        private string stringValue;
        private double doubleValue;
        private int intValue;
        private DateTime datetimeValue;
        public DataClass()
        {
            this.DoubleValue = 125.6;
            this.IntValue = 23;
            this.StringValue = "125";
            this.DatetimeValue = DateTime.Now;
        }
        public string StringValue
        {
            get
            {
                return stringValue;
            }
            set
            {
                if (this.stringValue != value)
                {
                    this.stringValue = value;
                    this.OnPropertyChanged("StringValue");
                }
            }
        }
        public double DoubleValue
        {
            get
            {
                return doubleValue;
            }
            set
            {
                if (this.doubleValue != value)
                {
                    this.doubleValue = value;
                    this.OnPropertyChanged("DoubleValue");
                }
            }
         }
        public DateTime DatetimeValue
        {
            get
            {
                return datetimeValue;
            }
            set
            {
                if (this.datetimeValue != value)
                {
                    this.datetimeValue = value;
                    this.OnPropertyChanged("DatetimeValue");
                }
            }
        }
        public int IntValue
        {
            get
            {
                return intValue;
            }
            set
            {
                if (this.intValue != value)
                {
                    this.intValue = value;
                    this.OnPropertyChanged("IntValue");
                }
            }
        }
        public event PropertyChangedEventHandler PropertyChanged;
        protected virtual void OnPropertyChanged(string propertyName)
        {
            if (this.PropertyChanged != null)
            {
                this.PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
            }
        }
    }
CopyVB.NET
Public Class DataClass
    Implements INotifyPropertyChanged
    Private m_stringValue As String
    Private m_doubleValue As Double
    Private m_intValue As Integer
    Private m_datetimeValue As DateTime
    Public Sub New()
        Me.DoubleValue = 125.6
        Me.IntValue = 23
        Me.StringValue = "125"
        Me.DatetimeValue = DateTime.Now
    End Sub
    Public Property StringValue() As String
        Get
            Return m_stringValue
        End Get
        Set(ByVal value As String)
            If Me.m_stringValue <> value Then
                Me.m_stringValue = value
                Me.OnPropertyChanged("StringValue")
            End If
        End Set
    End Property
    Public Property DoubleValue() As Double
        Get
            Return m_doubleValue
        End Get
        Set(ByVal value As Double)
            If Me.m_doubleValue <> value Then
                Me.m_doubleValue = value
                Me.OnPropertyChanged("DoubleValue")
            End If
        End Set
    End Property
    Public Property DatetimeValue() As DateTime
        Get
            Return m_datetimeValue
        End Get
        Set(ByVal value As DateTime)
            If Me.m_datetimeValue <> value Then
                Me.m_datetimeValue = value
                Me.OnPropertyChanged("DatetimeValue")
            End If
        End Set
    End Property
    Public Property IntValue() As Integer
        Get
            Return m_intValue
        End Get
        Set(ByVal value As Integer)
            If Me.m_intValue <> value Then
                Me.m_intValue = value
                Me.OnPropertyChanged("IntValue")
            End If
        End Set
    End Property
    Public Event PropertyChanged As PropertyChangedEventHandler
    Protected Overridable Sub OnPropertyChanged(ByVal propertyName As String)
        RaiseEvent PropertyChanged(Me, New PropertyChangedEventArgs(propertyName))
    End Sub
End Class

The next step is to set the DataContext:

CopyC#
public MainPage()
        {
            InitializeComponent();
            DataClass ds = new DataClass();
            this.DataContext = ds; 
        }
CopyVB.NET
Public Sub New()
    InitializeComponent()
    Dim ds As New DataClass()
    Me.DataContext = ds
End Sub

In XAML you can set different value bindings. First, you need to include the Telerik.Windows.Controls.Input assembly in your XAML declaration.

CopyXAML
<!--  StandarMask:  -->
<telerik:RadMaskedTextBox Mask="#####" 
                          MaskType="Standard"
                          Value="{Binding IntValue, Mode=TwoWay}" />
<telerik:RadMaskedTextBox Mask="#####" 
                          MaskType="Standard"
                          Value="{Binding IntValue}" />
<telerik:RadMaskedTextBox Mask="#####" 
                          MaskType="Standard"
                          Value="{Binding StringValue, Mode=TwoWay}" />
<telerik:RadMaskedTextBox Mask="#####" 
                          MaskType="Standard"
                          Value="{Binding StringValue}" />
<!--  NumericMask:  -->
<telerik:RadMaskedTextBox Mask="n" 
                          MaskType="Numeric"
                          Value="{Binding DoubleValue, Mode=TwoWay}" />
<telerik:RadMaskedTextBox Mask="n" 
                          MaskType="Numeric"
                          Value="{Binding DoubleValue}" />
<telerik:RadMaskedTextBox Mask="n" 
                          MaskType="Numeric"
                          Value="{Binding IntValue, Mode=TwoWay}" />
<telerik:RadMaskedTextBox Mask="n" 
                          MaskType="Numeric"
                          Value="{Binding IntValue}" />

<!--  DateTimeMask:  -->
<telerik:RadMaskedTextBox Mask="D" 
                          MaskType="DateTime"
                          Value="{Binding DatetimeValue, Mode=TwoWay}" />
<telerik:RadMaskedTextBox Mask="D" 
                          MaskType="DateTime"
                          Value="{Binding DatetimeValue}" />

<!--  NoneMask:  -->
<telerik:RadMaskedTextBox MaskType="None" Value="{Binding IntValue, Mode=TwoWay}" />
<telerik:RadMaskedTextBox MaskType="None" Value="{Binding IntValue}" />