Question

我有一个搜索栏，数据使用afterkeydown将结果绑定到网格中。但是，绑定发生得太快了。在结果开始填充之前，用户只有一次按键的时间。我有一个Block UI元素，可以在加载结果时阻止与页面的交互，从而在单个字符处停止搜索查询，直到加载结果。

我知道有一个名为rateLimit的淘汰延长器，可以在更改停止后的指定时间段之后延迟通话，但在将其添加到'searchTerm'的定义时，我一直看不到任何差异。我应该使用另一种方法吗？

我提供了我的搜索框，'searchTerm'可观察的定义以及用于加载网格结果的位置：

<input data-bind="value: searchTerm, valueUpdate: 'afterkeydown'" />

淘汰赛：

var app = app || {};
    app.data = @Html.Raw(Json.Encode(Model));

app.CreateVM = function (data) {
    var vm = {};
    vm.searchTerm = ko.observable(data.Search);
    ...
}

vm.filterResults = function () {
    app.getResultsList(vm.selectedItem(), vm.searchTerm(), vm.currentPage() + 1, vm.sortDirection(), vm.sortProperty(), updateGrid);
}

app.getResultsList = function (Id, searchTerm, pageIndex, sortDirection, sortProperty, callBack) {

$.ajaxCall({
    url: $('#clientGrid').data('url'),
    type: 'GET',
    dataType: 'json',
    data: {
        Id: Id,
        pageIndex: pageIndex,
        sortDirection: sortDirection,
        sortProperty: sortProperty,
        filter: searchTerm
    },
    ...
}

Answer 1

您尚未发布相关代码，因此我无法确定，但我猜测问题是您每次都手动启动更新，而不是使用searchTerm observable的更改事件来触发它。 knockout 这样做的方法是将结果网格数据绑定到计算的observable。

这是一个jsFiddle演示rateLimit扩展名：fiddle

如果您想要包含更多关于触发ajax调用以更新网格的代码，我们可能会帮助查明问题。

Knockout.js延迟valueUpdate：afterkeydown

1 个答案: