I would like an editing mask for phone numbers, along the lines of
"+00 0000 000000" or "+00-0000-000000".
The leading + to be stored as part of the data, but the spaces or hyphens are not.
The only characters that should be typed are digits.
There is unfortunate a variation in how different countries display numbers.
Is it possible to get this format to work with a password field? For example, if I wanted to be able to add hyphens to a private number but still keep it masked with asterisks so that as the user typed, it would appear as shown in the image?
Hello,
I tried to hide the mask prompt characters. But I got strange results.
If I use empty string as a promptChar
input.kendoMaskedTextBox({ mask: "&", promptChar: "" });
then the mask doesn't work at all.
When I use a space as a promptChar
input.kendoMaskedTextBox({ mask: "&", promptChar: " " });
then the mask enforces the length but not contents - I can enter a space even when I shouldn't be able.
When I use an underscore as a promptChar or use default
input.kendoMaskedTextBox({ mask: "&", promptChar: "_" });
input.kendoMaskedTextBox({ mask: "&" });
then everything works as it should, I can enter only one character but not a space.
Is this a feature or a bug? I'm using Kendo UI v2021.1.119.
When a user clicks on the masked text box and there is no current value then the cursor should be at the beginning (left).
This does not happen. But you've had forum posts in the past and you told the poster that it should do this. I even see two bugs written for it: here and here. They both seem to indicate this is the expected behavior.
This doesn't work even in the online demos. Using a standard desktop with Chrome or using a touch screen device (Surface) I get the same behavior. The cursor goes wherever I clicked.
How can I force the cursor to always go to the far left?
I'm looking to add custom rules to a masked textbox and there is not enough documentation or examples to explain how this works properly.
$(this).kendoMaskedTextBox({
mask: "mm/dd",
rules: {
mm: "any number between 01 - 12",
dd: "any number between 01 - 31"}})
I attempted to use a masked date picker, but it still allows for entries like "48/99" which is incorrect.
Is it possible to do something like this using custom rules and regex?
Is there a configuration setting or sample code for entering currency amounts in ATM style ?
For example
key
press display
1 $ .1
2 $ .12
3 $ 3.12
5 $ 53.12
1 $ 153.12
2 $ 2,153.12
1 $ 12,153.12
etc...
Is it possible to just include the kendo.maskedtextbox.min.js in my page? instead of the 3MB kendo.all.min.js file?
What are all the includes needed for maskedtextbox and validation?
Thanks!
This occurs even in the masked textbox API demo.
On Page load the markup looks like this:
<
span
class
=
"k-widget k-maskedtextbox"
style
=
"width: 100%;"
>
<
input
id
=
"maskedtextbox"
name
=
"maskedtextbox"
style
=
"width: 100%"
data-role
=
"maskedtextbox"
class
=
"k-textbox"
autocomplete
=
"off"
><
span
class
=
"k-icon k-i-warning"
>
</
span
>
</
span
>
<
script
>kendo.syncReady(function(){jQuery("#maskedtextbox").kendoMaskedTextBox({"mask":"(999) 000-0000","rules":{}});});</
script
>
The mask works.
If you click the Readonly button the markup changes to this:
<
span
class
=
"k-widget k-maskedtextbox"
style
=
"width: 100%;"
>
<
input
id
=
"maskedtextbox"
name
=
"maskedtextbox"
style
=
"width: 100%"
data-role
=
"maskedtextbox"
class
=
"k-textbox"
autocomplete
=
"off"
readonly
=
"readonly"
>
<
span
class
=
"k-icon k-i-warning"
></
span
></
span
>
<
script
>
kendo.syncReady(function(){jQuery("#maskedtextbox").kendoMaskedTextBox({"mask":"(999) 000-0000","rules":{}});});<
/
script
>
The only apparent difference is the addition of the readonly attribute.
If I remove the readonly attribute. I can type in the textbox again, but it doesn't follow the mask.