Update Kendo NumericTextBox with MVVM on spin

javascript, jquery, kendo-ui, kendonumerictextbox, mvvm

Solution

I checked your `jsbin` and I saw some errors in html and javascript. I think while you were testing different codes you forgot to correct it. Anyway I clean up and correct your codes and put them to this `jsfiddle`.

After putting breakpoint (`debugger;`) I saw you are right `onSpin` event triggers infinitely but this odd act happens if you put a breakpoint in the event. If you remove breakpoint and put a `console.log("`onSpin`event triggered.");` you see everything is okay and the event just triggered just once.

I faced before with such issues in different scenarios for example using `alert()` instead of `console.log()` for debugging purpose.

Codes:

var viewModel = kendo.observable({
    selectedNumber: 0,
    isEnabled: true,
    isVisible: true,
    onSpin: function () {
        //debugger;
        console.log("`onSpin` event triggered.");
        $("#ntb").getKendoNumericTextBox().trigger("change");
    },
    onChange: function () {}
});
kendo.bind($("#example"), viewModel);

Problem

Take a look at the MVVM example here: How can I get the MVVM value to update on the spin event (clicking the up or down arrows) Here is what I tried: In the spin event, I tried to do ``` $("#ntb").getKendoNumericTextBox().trigger("change"); ``` That worked but had weird side effects. If there are enough elements on the DOM, the spin event will keep firing. Another way to reproduce this is to take the code from here (jsbin) Insert it in a HTML file, load it in Chrome or FF and then insert a break point at this line: ``` $("#ntb").getKendoNumericTextBox().trigger("change"); ``` Keep hitting continue and you will see the breakpoint get hit time after time. In firefox, if my DOM is large enough, I get a repro without a breakpoint.

Original source