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

KendoUI NumericTextBox output type is “text” instead of “number”

5 Answers 1287 Views
NumericTextBox
This is a migrated thread and some comments may be shown as answers.
Joe
Top achievements
Rank 1
Joe asked on 23 Nov 2015, 03:56 PM

I am using KendoUI components to write a mobile friendly website. I've come across my first issue with the KendoUI controls. I have an Input DOM element as below:

<input type="number" id="myNumberInput" min="1" max="10" />

and the javascript behind this is as follows:

var inputDOM = $("#myNumberInput");
inputDOM.kendoNumericTextBox({format: "#"});

after the kendo control has been created, both the new input tag created by kendo and the old ones have both had their "type" properties set to "text" instead of "number". This has now completely removed the benefits on a phone where a context specific (i.e a number pad) is displayed when a "number" type input is selected.
Is there any way I can change the type property back to "number", or is there anything i'm missing?.
I can change the type of the original input object by just doing the below after the kendo control is made

inputDOM.prop("type", "number");

but this doesn't help the actual control now visible to the user. I've also tried the wrapper and element properties on the numericTextBox object as below

inputDOM.data("kendoNumericTextBox").element.prop("type", "number"); inputDOM.data("kendoNumericTextBox").wrapper.prop("type", "number");

but this did not seem to change the property of the visible control, the "element" only changed the value of the original now hidden Input element.
Any ideas where i've gone wrong, or how I can achieve this?

5 Answers, 1 is accepted

Sort by
0
Dimo
Telerik team
answered on 25 Nov 2015, 06:41 AM
Hi Joe,

Please check the following documentation section -

http://docs.telerik.com/kendo-ui/web/numerictextbox/overview#input-type

Regards,
Dimo
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Joe
Top achievements
Rank 1
answered on 25 Nov 2015, 08:52 AM

Hi Dimos,

I'm interested what actually stops working if the type tag is set to "number" instead of "text". Is this also you saying there is no way I can access the output HTML via the kendo methods in js to try it myself?

0
Dimo
Telerik team
answered on 25 Nov 2015, 04:19 PM
Hello Joe,

<input type="number" /> currently does not support values with a comma as a decimal separator.

We will update the mentioned documentation section with more specific information shortly. You can check it once the changes are uploaded and let me know if you have additional questions.

Regards,
Dimo
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Paul
Top achievements
Rank 1
Iron
Iron
Veteran
answered on 24 Aug 2020, 05:52 PM
If you can't get type="number" on the element then you get an alpha keyboard on touch devices. 
0
Tsvetomir
Telerik team
answered on 26 Aug 2020, 01:34 PM

Hi Paul,

It is correct that the browsers open the numeric keyboard only if the input's type attribute is number. Please refer to the forum thread below in which the possible solutions are explained, as well as, I have provided more details on why we should keep the attribute set to "text".

https://www.telerik.com/forums/numeric-keyboard-on-iphone#JIwJWoO6Z0mV5Hq2EfbBgg

If any additional questions arise, let me know.

 

Kind regards,
Tsvetomir
Progress Telerik

Five days of Blazor, Angular, React, and Xamarin experts live-coding on twitch.tv/CodeItLive , special prizes and more, for FREE?! Register now for DevReach 2.0(20).

Tags
NumericTextBox
Asked by
Joe
Top achievements
Rank 1
Answers by
Dimo
Telerik team
Joe
Top achievements
Rank 1
Paul
Top achievements
Rank 1
Iron
Iron
Veteran
Tsvetomir
Telerik team
Share this question
or