Pad Fill Zeros

[Chris]

Hi,

I am needing to mask the input of a textbox, padding the string value with zeros ("01", "02", "03"...)  Which control should I used, (RadMaskedTextbox, RadMasked___Input, etc) and what settings?

tia

[Tina Stancheva]

Hi Chris,

Thank you for writing to us. I believe in your case you will have to make a choice between the RadMaskedTextInput and RadMaskedNumericInput controls. The main difference between the two controls lays in the type of their Value property.

The RadMaskedNumericInput control is designed to work with double? values as this is the type of its Value property. Therefore its logic is build around the assumption that its input represents a double value. This is why if you enter 7 within an empty RadMaskedNumericInput, the Value of the control will be 7. As 07 is not considered a valid double value the control will not automatically add 0s in front of the single digit input. However, you can set the Placeholder property to 0 thus replacing all placeholders (the indicator of the empty positions within the component) with 0. Furthermore, if you set the TextMode of the control to MaskedText, its Text value will represent the formatted Value including the placeholder characters - in our example this would mean that even if the Value is 7, the Text will be 07.

The RadMaskedTextInput, on the other hand, exposes a Value of type String. This is why it is build to work with string values that can include numbers, chars, letters and different symbols. You can also set its Placeholder to 0 and its TextMode to MaskedText - this will fill all empty positions within the control with 0s and will make sure that the Text property holds the formatted Value and the placeholders.

Unfortunately I cannot tell for sure which of the two controls will best work for you and therefore I'd recommend testing their behavior in our online demos:

• MaskedNumericInput Configurator
• MaskedTextInput Configurator

You can also create a small sample and test the following setup:

<StackPanel x:Name="LayoutRoot" Background="White">
    <telerik:RadMaskedNumericInput x:Name="rmni"
               AutoFillZeros="True"
               Mask="#2"
               Placeholder="0"
               SelectionOnFocus="CaretToEnd"
               TextMode="MaskedText" />
    <StackPanel Orientation="Horizontal">
        <TextBlock FontWeight="Bold" Text="Value: " />
        <TextBlock Text="{Binding ElementName=rmni, Path=Value}" />
    </StackPanel>
    <StackPanel Orientation="Horizontal">
        <TextBlock FontWeight="Bold" Text="Text: " />
        <TextBlock Text="{Binding ElementName=rmni, Path=Text}" />
    </StackPanel>
    <telerik:RadMaskedTextInput x:Name="rmti"
                InputBehavior="Replace"
                Mask="#2"
                Placeholder="0"
                SelectionOnFocus="CaretToEnd"
                TextMode="MaskedText" />
    <StackPanel Orientation="Horizontal">
        <TextBlock FontWeight="Bold" Text="Value: " />
        <TextBlock Text="{Binding ElementName=rmti, Path=Value}" />
    </StackPanel>
    <StackPanel Orientation="Horizontal">
        <TextBlock FontWeight="Bold" Text="Text: " />
        <TextBlock Text="{Binding ElementName=rmti, Path=Text}" />
    </StackPanel>
</StackPanel>

I hope this information can get you started. And don't hesitate to write back if you have more questions.

Regards,
Tina Stancheva
Telerik