In Numeric Textbox when provide value more than 16 digits, Clicking outside the textbox, The number automatically gets incremented and decremented on different values
Another scenario when the provide value more than 20 digits, Clicking outside the textbox displays only one digit or different value
Do we have any solution/workaround to achieve this scenario?
The details here, do not seem to work for AngularJS implementation. Nothing happens, and none of my log messages are shown on click or focus.
http://docs.telerik.com/kendo-ui/controls/editors/numerictextbox/how-to/select-all-on-focus
My Html:
<input kendo-numeric-text-box
k-min="0"
k-ng-model="params.averagePrice.max"
style="width: 45%;"
k-format="'n1'"
k-step="0.1"
k-on-change="maxChange(params.averagePrice)"
k-on-spin="maxChange(params.averagePrice)"/>
Inside my Angularjs Controller:
$(document).ready(function () {
$("input[type=text]").bind("focus", function () {
$log.info("bind focus ");
var input = $(this);
clearTimeout(input.data("selectTimeId")); //stop started time out if any
var selectTimeId = setTimeout(function () {
input.select();
});
input.data("selectTimeId", selectTimeId);
}).blur(function (e) {
$log.info("bind blur");
clearTimeout($(this).data("selectTimeId")); //stop started timeout
})
});
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:
"#"
});
inputDOM.prop(
"type"
,
"number"
);
inputDOM.data(
"kendoNumericTextBox"
).element.prop(
"type"
,
"number"
); inputDOM.data(
"kendoNumericTextBox"
).wrapper.prop(
"type"
,
"number"
);
Hi there,
I wanted to create my own custom widget binding for max configuration of numeric textbox. With that, I found this article which describes on how to bind the max value of a Kendo UI numeric textbox widget. The binding of the element that I want to achieve is like this
<
input
data-role
=
"numerictextbox"
id
=
"numeric"
data-bind
=
"value: value, max: max"
/>
However, when I implement the provided code on this article https://docs.telerik.com/kendo-ui/framework/mvvm/bindings/custom#custom-widget-binding-in-typescript - Custom Widget Binding I got an exception when applyBinding function is called in kendo.all.js. Please see screen shot attached.
Below is my custom widget binding implementation:
var dataStoreData = {max_lines: 20
max_orders: 50000
max_orders_per_request: 500
}
kendo.data.binders.widget.max = kendo.data.Binder.extend({
init: (widget, bindings, options) => {
// Call the base constructor
kendo.data.Binder.fn.init.call(this, widget.element[0], bindings, options);
},
refresh: () => {
const that = this,
value = that.bindings["max"].get(); // Get the value from the View-Model
$(that.element).data("kendoNumericTextBox").max(value); // Update the widget
}
});
maxResultSettingsViewModel = kendo.observable({
data: dataStoreData,
settings: dataStoreData,
onDataValueChange: changeData => {
console.debug("onDataValueChange event is triggered.", changeData);
},
onClickEvent: clickData => {
console.debug("onClickEvent event is triggered.", clickData);
}
});
// Bind the container element with the observable object
kendo.bind($("#collapsible-content"), maxResultSettingsViewModel);
Did I implement the above code incorrectly? Or, do I need to upgrade to new version of Kendo UI library?. currently, I'm using version 2019.3.1023
Any help is greatly appreciated.
Cheers,
Junius
The not in focus default for NumericTextBox always rounds to the nearest number defined by the format.
For Example:
$("#round_numeric").kendoNumericTextBox({
format: "n0",
value: 99.5,
min: 0, max: 100,
});
Displays 100.
I would like the not in focus format to round down (floor) so that the output is 99.
Can this be achieved?
Thanks
Hi there,
I'm struggling to make a kendo numeric textbox control make the user input as readonly but allow the user to use the spinner. The readonly method makes the control not usable entirely. I want only the user input box to be disabled, but the spinner should be working as is.
Is there any method or configuration that I can use? or does this feature is not supported on the current version?
Regards,
Junius
I have an application that uses an input for the user to enter a number. When the input is changed another field is recalculated based on the value entered. Because the application is used in different cultures and because the telerik interferes on data binding (see https://www.telerik.com/forums/numeric-input-on-popup-edit-on-different-language) with the decimal separator I have to change the input to a telerik numerictextbox. However the input event does not exist on the numerictextbox.
I tried using numerictextbox_text.on('input keyup', calculate) but they do not work. How can I have the input event on the numerictextbox?
Hello,
we have problem with NumericTextBox performance, we are trying to render 200 components (production report stuff).
Time which I get on Chrome 80 is ~2832ms, what interesting in FireFox 73 only 472ms, rendering 200 raw input (type=number) components is about 11ms.
How to optimize it, and why Chrome is 5x slower than FireFox in this case
https://dojo.telerik.com/iXUJaLAW/3