RadMaskedNumericInput Default Value When Cleared

1 Answer 40 Views
MaskedInput (Numeric, DateTime, Text, Currency)
Lee
Top achievements
Rank 1
Veteran
Lee asked on 22 Dec 2021, 10:06 PM

Hello!

I'm working with the RadMaskedNumericInput for the first time (first time using masked inputs at all) and am in need of advice. I want to have the control's value be set to a default value if the user were to clear the control's input, then remove the focus.

I have the control set up like so:

<telerik:RadMaskedNumericInput x:Name="txtDaysValid" Width="30" Value="30"
                               Mask="d2" TextMode="PlainText" InputBehavior="Insert"
                               maskedInput:MaskedInputExtensions.Minimum="1"
                               UpdateValueEvent="LostFocus"
                               LostFocus="txtDaysValid_LostFocus"/>

And the event handler is:

var numericInput = sender as RadMaskedNumericInput;

if (string.IsNullOrWhiteSpace(numericInput.Text))
{
    numericInput.Value = 30;
    numericInput.Text = numericInput.Value.ToString();
}

This is the behaviour I'm currently experiencing:

  • Control Reads 30 -> User sets blank -> Control Reads blank (incorrect)
  • Control Reads 30 -> User sets to 12 -> Control Reads 12 -> User sets blank -> Control reads 30 (correct)
  • Control Reads 30 -> User sets to 12 -> Control Reads 12 -> User sets blank -> Control reads 30 -> User sets blank -> Control reads blank (incorrect)
  • Control Reads Blank -> User sets to 1 -> Control Reads 1 -> User sets blank -> Control Reads blank (incorrect)
  • Control Reads Blank -> User sets to 21 -> Control Reads 21 -> User sets blank -> Control Reads 30 (correct)

What am I missing here? It appears that updating the value and text directly only works in some cases. Is there a better approach to ensuring that when the user clears the input's field, that it defaults to a specific value upon losing focus?

Thanks!

1 Answer, 1 is accepted

Sort by
1
Accepted
Stenly
Telerik team
answered on 27 Dec 2021, 06:47 AM

Hello Lee,

In order to change the observed behavior, you could set the AllowInvalidValues property, of the RadMaskedNumericInput control, to True. By doing this, the control will allow property change on every user input, which will result in the behavior that you are expecting. The provided article contains additional information regarding this property's functionality. The following code snippet shows the provided RadMaskedNumericInput control instance, modified to include this property:

<telerik:RadMaskedNumericInput x:Name="txtDaysValid" Width="30" Value="30"
                               Mask="d2" InputBehavior="Insert" TextMode="PlainText"
                               AllowInvalidValues="True"
                               maskedInput:MaskedInputExtensions.Minimum="1"
                               UpdateValueEvent="LostFocus"
                               LostFocus="txtDaysValid_LostFocus"/>

Furthermore, you would need to check if the Value property is null because when the aforementioned property is used, and if the Value property does not meet the validation requirements, the internal control logic will set it to null.

private void txtDaysValid_LostFocus(object sender, RoutedEventArgs e)
{
    var numericInput = sender as RadMaskedNumericInput;

    if (numericInput.Value == null)
    {
        numericInput.Value = 30;
    }
}

In conclusion, I have attached a sample project for you to test, so, could you give it a try?

Regards,
Stenly
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Lee
Top achievements
Rank 1
Veteran
commented on 03 Jan 2022, 03:47 PM

Hi Stenly,

Your solution functions perfectly, thank you!

Tags
MaskedInput (Numeric, DateTime, Text, Currency)
Asked by
Lee
Top achievements
Rank 1
Veteran
Answers by
Stenly
Telerik team
Share this question
or