Giá trị Knockout.jsCập nhật không hoạt động khi người dùng sử dụng bàn phím

Question

Im sử dụng Knockout.js và ASP.NET. HTML của tôi là như sau:

<div class="InputField"> 
    Fixed/Floating 
    <div class="FieldContainer"> 
     <select data-bind="options: $root.FixedLoanOptions, selectedOptions: IsFixed, valueUpdate: 'change'" ></select> 
    </div> 
</div> 

Nếu người dùng sử dụng chuột để chọn mục, JSON đi lại cho máy chủ với các thông tin cập nhật. Nhưng nếu người dùng sử dụng "tab" tab trên điều khiển chọn, chọn một mục và tab tắt, sau đó ngay cả khi mục đã chọn được hiển thị trên giao diện người dùng, JSON trở lại với một giá trị trống cho điều khiển này.

Dường như kiểu xem Knockout không cập nhật nếu người dùng chỉ sử dụng khóa bàn phím, có vẻ như có một số sự kiện thay đổi xảy ra cụ thể trong trình duyệt khi người dùng sử dụng chuột.

Làm cách nào để khắc phục sự cố này? Có cách nào tôi có thể đăng ký các sự kiện onchange chọn hộp để sử dụng một chức năng cập nhật các mô hình Knockout bằng tay?

Tôi đã thử nó trong cả IE9 và Firefox và tôi có cùng một vấn đề trong cả hai.

Answer 1

Phần còn lại của mã trông như thế nào? Cuộc gọi AJAX được thực hiện như thế nào?

dụ này sửa đổi một lựa chọn với bàn phím hoạt động OK cho tôi trên IE và Firefox:

http://jsfiddle.net/mikebridge/yYS7c/2/

Answer 2

Bạn có thể thay đổi sự kiện khi knockoutj cập nhật mô hình làm mờ được kích hoạt nhiều hơn.

<div class="InputField"> 
    Fixed/Floating 
    <div class="FieldContainer"> 
     <select data-bind="valueUpdate: 'blur', options: $root.FixedLoanOptions, selectedOptions: IsFixed" ></select> 
    </div> 
</div> 

Answer 3

Như bạn có thể nhìn thấy trên mô hình cập nhật Live example Knockout chỉ khi chọn tùy chọn được chọn:

• Nhấp chuột
• Nhấn nút enter được chọn bằng các nút mũi tên trên bàn phím.

Answer 4

Ràng buộc giá trịCập nhật thành 'keyup' đã thực hiện thủ thuật cho tôi. Không ảnh hưởng đến những thay đổi được thực hiện bằng chuột, vì vậy trông rất đẹp cho đến nay.

Vì vậy, một cái gì đó như thế này nên làm việc:

<div class="InputField"> 
    Fixed/Floating 
    <div class="FieldContainer"> 
     <select data-bind="valueUpdate: 'keyup', options: $root.FixedLoanOptions, selectedOptions: IsFixed" ></select> 
    </div> 
</div>