2017-02-08 16 views
0

私は、データが結果をバインドする検索バーをafterkeydownを使ってグリッドに持っています。しかし、バインディングはあまりに早く起こっています。ユーザーは、結果が入力される前に1回だけキーを押す時間があります。私は結果がロードされている間、ページとのやりとりを妨げるブロックUI要素を持っているので、結果がロードされるまで検索クエリが1文字で停止します。Knockout.js delay valueUpdate:afterkeydown

rateLimitと呼ばれるノックアウトエクステンダーがあり、変更が停止してから指定された時間が経過するまでコールが遅れることがわかりましたが、「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 
    }, 
    ... 
} 

答えて

2

をあなたが投稿していません関連するコードはわかりませんが、問題を推測しているのは、観測可能な変更イベントを使用してトリガーする代わりに、毎回手動でアップデートを実行しているということです。 ノックアウトこれを行う方法は、結果のグリッドを計算された観測値にデータバインドすることです。あなたは、グリッドを更新するために、あなたのAJAX呼び出しは、我々は、おそらく問題を特定することができますトリガ何に関するいくつかのより多くのコードを含める場合fiddle

:ここ

rateLimit拡張子を実証jsFiddleです。

+0

この遅延時間は入力イベントにのみ適用されるのではなく、観測値の値をプログラムによって更新した場合でも適用されます。 – Hp93