変更の選択イベントでオートコンプリートの値を消去します

Question

私は以下を持っていますhttp://jsfiddle.net/TgBzB/3/とユーザーが項目を選択したときにオートコンプリートフィールドをクリアします。次のコードではこれを行いません。 -

$("#input").data("kendoAutoComplete").value(""); 

これは可能ですか？

//create AutoComplete UI component 
$("#input").kendoAutoComplete({ 
    dataSource: data, 
    filter: "startswith", 
    placeholder: "Select country...", 
    select: function(e) { 
     var dataItem = this.dataItem(e.item.index()); 
     $('#list').append("<li>" + dataItem + "</li>"); 
     //How do I clear the #input here? 
     $("#input").data("kendoAutoComplete").value(""); 
    } 
}); 

Answer 1

コードは入力をクリアしますが、selectイベントは早く発生し、その後に値が追加されます。これは、単に使用して最初の場所に表示さからそれを停止する代わりに、変更イベントの後に、それをクリアするだけでなくだけで動作し、別の代替案である

$("#input").kendoAutoComplete({ 
    dataSource: data, 
    filter: "startswith", 
    placeholder: "Select country...", 
    select: function(e) { 
     var dataItem = this.dataItem(e.item.index()); 
     $('#list').append("<li>" + dataItem + "</li>"); 
    }, 
    change: function(e) { 
     $("#input").data("kendoAutoComplete").value(""); 
    } 
}); 

Answer 2

：何がしなければならないことはchangeイベントでの入力をオフにしていますe.preventDefault();

... 
select: function(e) { 
     var dataItem = this.dataItem(e.item.index()); 
     $('#list').append("<li>" + dataItem + "</li>"); 
     $("#input").data("kendoAutoComplete").value(""); 
     e.preventDefault(); 
} 
... 

はjsFiddle

Answer 3

http://jsfiddle.net/rippo/TgBzB/8/単にあなたが完全に自動クリアすることができ、これを使用してを更新した

 $("#autoCompleteName").val(""); 

Answer 4

select: function(e) { 

.... e.preventDefault（）。

}

文句を言わない（すぐに入力します）あなたが同じキーワードを検索することができます。同じキーワードを文字単位で入力すると、数ミリ秒かかることがあります。

Answer 5

MVVMバインディングをマルチセレクト値に使用しても、正常に動作します。

select: function(e) { 
    var widget = $('#widgetId').data('kendoMultiSelect'); 
    widget.input.val(''); 
}