/ /剣道-ノックアウト-オートコンプリートをリモートデータにバインドする方法は? --knockout.js、kendo-ui

Kendo-Knockout - オートコンプリートをリモートデータにバインドする方法は? - knockout.js、kendo-ui

剣道ノックアウトを使用しています。

オートコンプリートをリモートデータにバインドしようとしています。 で基本的な例を使用する http://rniemeyer.github.com/knockout-kendo/web/AutoComplete.html 私は次のことを試しました。しかし、 サーチ 入力がフォーカスを失うまで更新されません。

"サーチ「何かを探すのは 既に observableArray内。

剣道オートコンプリートで提供される唯一のイベントは「変更」です。これは、入力がフォーカスを失った後にのみ発生します。

キーの押下をどのようにインターセプトし、search()の値にアクセスして、リモート呼び出しを行えるようにしますか?

さらに、「」の値にどのようにアクセスしますかid「アイテムが選択されたら?

ありがとう ジェレミー

<strong><p style="margin-top: 100px;" data-bind="text: search"></p></strong>

<input data-bind="kendoAutoComplete: { data: choices, value: search,
dataTextField: "name",  valueUpdate: "afterkeydown" }" />

<script type="text/javascript">
$(function () {
var myViewModel = function () {
var self = this;
this.choices = ko.observableArray([
{ id: "1", name: "apple" },
{ id: "1", name: "apple2" },
{ id: "1", name: "apple3" },
{ id: "2", name: "orange" },
{ id: "3", name: "banana" }
]);

this.selectedChoice = ko.observable();

self.search = ko.observable();

self.search.subscribe(function() {
console.log(self.search());
// would send search to $.ajax to get the remote data
});
};

ko.applyBindings(new myViewModel());
});

回答:

回答№1は2

次のようなことを行うことができます。

<input data-bind="kendoAutoComplete: {
data: {},
minLength: 3,
dataTextField: "Name",
dataSource: {
type: "odata",
serverFiltering: true,
serverPaging: true,
pageSize: 20,
transport: {
read: "http://odata.netflix.com/Catalog/Titles"
}
},
value: selectedChoice }" />

これをJavaScriptオブジェクトに保存し、それを指すこともできます。

サンプル: http://jsfiddle.net/rniemeyer/m8vVA/


回答№2の場合は0

次のノックアウトバインディングにより、ビューモデル内で変更される検索フィルターのライブ更新が可能になります。

<input data-bind="kendoAutoComplete:
{
value: value,
data: suggestions,
filtering: onSuggestionsChanged
}" />

値は選択された値であり、提案は結果を入力する監視可能な配列とonSuggestionsChangedは、ユーザーがフィールドのテキストを変更するたびに呼び出されるビューモデルの関数です。

剣道UIフィルターイベントの説明