Wyczyść wartość autouzupełniania podczas zmiany Wybierz zmianę

Question

Mam następujące http://jsfiddle.net/TgBzB/3/ i chcę wyczyścić pole autouzupełniania, gdy użytkownik wybrał element. Poniższy kod tego nie robi: -

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

Czy to możliwe?

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

Twój kod usuwa dane wejściowe, ale zdarzenie select uruchamia się wcześniej i wartość jest dodawana po. Co trzeba zrobić, to wyczyścić wejście na change imprezy:

$("#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

Jest też inna alternatywa, która działa tak samo dobrze, zamiast usuwania go po zdarzeniu zmiany po prostu zatrzymać wyświetlanie w pierwszej kolejności za pomocą e.preventDefault();

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

zaktualizowaniu jsFiddle http://jsfiddle.net/rippo/TgBzB/8/

Answer 3

prostu za pomocą tego można wyczyścić auto kompletne

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

Answer 4

select: function(e) { 

.... e.preventDefault();

}

przyzwyczajenie pozwalają wyszukiwać samo słowo kluczowe (typ natychmiast). będzie działać, jeśli wpiszesz to samo słowo kluczowe przez znak, dając trochę milisekund.

Answer 5

Działa to dobrze, nawet jeśli używasz powiązania MVVM do wartości wielokrotnego wyboru.

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