MaskedTextbox setting its value to empty

0 Answers 41 Views
MaskedTextBox
Pablo
Top achievements
Rank 1
Pablo asked on 11 Mar 2023, 07:46 AM

I'm trying to check if there are any changes in a form so that I can warn the user of changes, but when setting the model and binding a null value to the MaskedTextbox it changes it to an empty string and the user gets the message that something has changed. Is there a way to prevent the MaskedTextbox from doing that?

 

Georgi
Telerik team
commented on 15 Mar 2023, 02:36 PM

Hi Pablo, 

Thank you very much for the details provided.

From what I understand from your question, you are looking for an implementation that would allow you to set the value of the MaskedTextBoxComponent to null. Please, correct me if misunderstood you. 

Having consulted the matter with our development team, it turns out that by default the MaskedTextBoxComponent checks whether a value is bound, and in case it is not or is null/undefined, the component normalizes it to an empty string. I fully understand that this behavior might be frustrating to some extent but it is the intended behavior of the component by design. 

What I could suggest as a workaround would be for the developer to check for the length of the MaskedTextBoxComponent's value and indicate whether a change has occurred based on it. To better illustrate this approach, I am sending you a StackBlitz demo that implements it: 

https://stackblitz.com/edit/angular-icfs4g-6xamvv?file=src%2Fapp%2Fapp.component.ts

I hope this helps. Let me know if you need additional assistance with this case. 

Regards,

Georgi

Progress Telerik

 

Pablo Tola
Top achievements
Rank 2
commented on 15 Mar 2023, 08:45 PM

Is there a way to bypass normalization?

The component should not modify the value. Null is different than Empty and if the value makes it all the way to the database it could cause issues if the logic is checking for null values.

Georgi
Telerik team
commented on 20 Mar 2023, 02:24 PM

Hi Pablo, 

Thank you very much for the additional details provided.

Having further discussed the matter with our development team, we concluded that the default implementation of the MaskedTextBoxComponent does not allow the developers to bypass the normalization method. I certainly understand that such a default normalization might be frustrating to some extent but it is aligned with the component's requirements by design. 

Another suggestion that our team came up with, which might be a potential workaround, would be to set the value of the MaskedTextBoxComponent to an empty string instead of null/undefined, and thus the validation that the developer uses to track changes in the form would not indicate for a change. 

I hope this answers your question. Let me know if I could further assist you with this case.

Regards,

Georgi

Progress Telerik

Pablo Tola
Top achievements
Rank 2
commented on 20 Mar 2023, 04:35 PM

Thanks for your reply, but it really doesn't solve the issue that I need null values, and replacing empty with nulls back and forth is a valid workaround, but pollutes the code with unnecessary logic. 

Thanks.

Georgi
Telerik team
commented on 23 Mar 2023, 01:12 PM

Hi Pablo, 

I can certainly understand your frustration regarding this default behavior of the MaskedTextBoxComponent but this is the behavior that the component is supposed to have by design. 

I am also aware that the suggested workaround may have its respective drawbacks but it is the only approach that our team can think of as of now. 

Let me know if you have any additional questions.

Regards, 

Georgi

Progress Telerik

No answers yet. Maybe you can help?

Tags
MaskedTextBox
Asked by
Pablo
Top achievements
Rank 1
Share this question
or