This is a migrated thread and some comments may be shown as answers.

Using maskedTextbox for any number

5 Answers 1236 Views
MaskedTextBox
This is a migrated thread and some comments may be shown as answers.
Michaël
Top achievements
Rank 1
Michaël asked on 08 Sep 2015, 04:40 PM

Hi,

 

I'm trying to use the MaskedTextBox to format currency number. However, the fact that we can only set one mask is too limited. For instance, I'd like that if the user write "111", it formats "111". Then if user write an additional number, like "1111", it formats as "1 111", then by adding another number, it formats as "11 111", then "111 111", then "1 111 111" and so on...

 Is this possible?

5 Answers, 1 is accepted

Sort by
0
Konstantin Dikov
Telerik team
answered on 10 Sep 2015, 11:04 AM
Hi Michaƫl,

For the requirement that you have you should use the NumericTextBox widget, instead of the MaskedTextBox, because the NumericTextBox will format the values as per your requirement when you use the currency format. Additionally, it will apply the correct currency format for the used culture. Following is a dojo example demonstrating such implementation (the first NumericTextBox):
Hope this helps.


Regards,
Konstantin Dikov
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Michaël
Top achievements
Rank 1
answered on 10 Sep 2015, 11:22 AM

Hi Konstantin,

 

Unfortunately that's not really what I want, becuase this component always apply the formatting (adding space) after validating. I'd like it to automatically add spaces while you're typing.

0
Konstantin Dikov
Telerik team
answered on 10 Sep 2015, 12:05 PM
Hi ,

The closest to your requirement behavior that you can achieve with MaskedTextBox is the one from the following example, where you define a mask with the spaces:
As for the NumericTextBox, you are correct that the value will be formatted only after you blur the input element, so for formatting while typing, the only valid option will be the one from the above example.


Regards,
Konstantin Dikov
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Michaël
Top achievements
Rank 1
answered on 10 Sep 2015, 12:06 PM
Unfortunately that's not really what I want :(. Is there any way to change the mask at runtime? Therefore, depending on the number of numbers, I could change the mask.
0
Konstantin Dikov
Telerik team
answered on 10 Sep 2015, 01:01 PM
Hi ,

If you want to change the mask you can get the original options and change the mask property. When you create the new mask you can use setOptions with the modified options to apply the new mask.
var maskedTextBox =  $("#maskedtextbox").data("kendoMaskedTextBox");
var count = maskedTextBox.raw().length; //will return the raw value
var options = maskedTextBox.options; //getting the original options
var newMask = ..//create your new mask
options.mask = "$ " + newMask;
maskedTextBox.setOptions(options);


Regards,
Konstantin Dikov
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Tags
MaskedTextBox
Asked by
Michaël
Top achievements
Rank 1
Answers by
Konstantin Dikov
Telerik team
Michaël
Top achievements
Rank 1
Share this question
or