Xử lý nút rõ ràng của IE 9 & 10 với Knockout binding

Question

Tôi có hộp văn bản đầu vào được gắn với knockout js có thể quan sát được.

<input id="searchTextBox" class="searchTextBox" type="text" maxlength="25" 
     title="Search" placeholder="Search" 
     data-bind="value: GridVm.FilterText, 
     valueUpdate: 'afterkeydown', 
     disable: GridVm.Data().length == 0" /> 

Vấn đề là FilterText quan sát không cập nhật khi người dùng nhấp vào x trong IE.

Tôi đã tìm thấy rằng tôi có thể remove the x (xem ảnh chụp màn hình trong câu hỏi được liên kết), nhưng đó là phương sách cuối cùng (tôi thích tính năng này). This forum says there is no event fired when the x is clicked.

Có sự kiện nào mà tôi có thể sử dụng để bắt buộc cập nhật Knockout có thể quan sát hay một cách hay để thực hiện điều này trong Knockout?

Answer 1

Nếu bạn chỉ cần thay đổi

valueUpdate: 'afterkeydown' 

để

valueUpdate: 'input' 

nó móc rằng sự kiện để kích hoạt việc cập nhật giá trị. Nó hoàn toàn tốt hơn vì nó cũng xử lý các hành động dựa trên clipboard và các hành động kéo thả văn bản.

Answer 2

Tôi đã tìm ra bằng cách sử dụng input event và Knockout's event binding. Dưới đây là my JsFiddle showing the solution với mã bên dưới.

<input type="search" id="input1" data-bind="value: textForBox, valueUpdate: 'afterkeydown', 
    event: { input: cleared }" /> 
var vm = { 
    textForBox: ko.observable(), 
    cleared: function (data, event) { 
     if (event.currentTarget.value === '') { 
      this.textForBox(''); 
     } 
    } 
}; 
ko.applyBindings(vm);