Cập nhật Kendo NumericTextBox với MVVM vào spin

Question

Hãy xem ví dụ MVVM here:

Làm thế nào tôi có thể nhận được giá trị MVVM để cập nhật trên các sự kiện quay (cách nhấn vào mũi tên lên hoặc xuống)

đây là những gì tôi đã cố gắng:

Trong trường quay, tôi đã cố gắng để làm

$("#ntb").getKendoNumericTextBox().trigger("change"); 

Đó làm việc nhưng có lạ tác dụng phụ.

Nếu có đủ yếu tố trên DOM, sự kiện quay sẽ tiếp tục kích hoạt.

Một cách khác để tái sản xuất này là để lấy mã từ here (jsbin)

Chèn nó trong một tập tin HTML, tải nó trong Chrome hoặc FF và sau đó chèn một điểm break ở dòng này:

$("#ntb").getKendoNumericTextBox().trigger("change"); 

Tiếp tục nhấn tiếp tục và bạn sẽ thấy điểm ngắt nhận được nhấn thời gian sau khi thời gian.

Trong firefox, nếu DOM của tôi đủ lớn, tôi nhận được repro không có điểm ngắt.

Answer 1

Tôi đã kiểm tra jsbin và tôi thấy một số lỗi trong html và javascript. Tôi nghĩ rằng trong khi bạn đang thử nghiệm các mã khác nhau, bạn quên sửa nó. Dù sao tôi dọn sạch và sửa mã của bạn và đặt chúng vào số jsfiddle này.

Sau khi đặt điểm ngắt (debugger;) Tôi thấy bạn đang đúng onSpin trình kích hoạt sự kiện vô hạn nhưng hành động kỳ lạ này xảy ra nếu bạn đặt điểm ngắt trong sự kiện. Nếu bạn xóa điểm ngắt và đặt console.log(" trênSpin event triggered."); bạn thấy mọi thứ đều ổn và sự kiện vừa được kích hoạt một lần.

Tôi đã gặp phải các sự cố như vậy trong các trường hợp khác nhau, ví dụ: sử dụng alert() thay vì console.log() cho mục đích gỡ lỗi.

---

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); 

Answer 2

hỗ trợ Kendo nói để chạy này trong trường hợp quay:

this.set('selectedNumber', e.sender.element.val()); 

Và điều đó làm vấn đề đi xa.

Answer 3

Bạn có thể thử mã bên dưới. Nó làm việc cho tôi.

ViewModel

viewModel.bind("change", function (e) { 
     console.log("property Changed on spin "); 
    }); 

đang Razor

<input id="tbSlideDuration" data-role="numerictextbox" 
          data-format="#" 
          data-min="1" 
          data-max="100" 
          data-bind="value:slideDuration, events: {spin:change}" /> 

này sẽ gọi sự kiện thay đổi dưới mui xe :)