处理IE 9&带有Knockout绑定的10个清除按钮

时间:2013-05-07 14:21:59

标签: internet-explorer input knockout.js

我有一个输入文本框绑定到knockout js可观察对象。

<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" />

问题是当用户在IE中单击x时,FilterText observable不会更新。

我发现我可以remove the x(参见链接问题中的屏幕截图),但这是最后的选择(我喜欢这个功能)。 This forum says there is no event fired when the x is clicked

是否有一个事件可以用来强制Knockout可观察的更新或在Knockout中执行此操作的好方法?

2 个答案:

答案 0 :(得分:11)

如果你只是改变

valueUpdate: 'afterkeydown'

valueUpdate: 'input'

它挂钩该事件以触发值更新。它总体上更好,因为它还处理基于剪贴板的操作和文本拖放操作。

答案 1 :(得分:5)

我使用input eventKnockout's event binding计算出来了。以下代码为my JsFiddle showing the solution

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