11

我有以下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(""); 
    }
});
4

5 回答 5

14

您的代码会清除输入，但选择事件会提前触发并在之后添加值。您要做的是清除changeevent 的输入：

$("#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(""); 
    }
});
于 2012-11-27T13:50:50.697 回答
4

这也是另一种同样有效的替代方法，而不是在更改事件后清除它，只需通过使用来阻止它首先显示e.preventDefault(); 

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

已更新 jsFiddle http://jsfiddle.net/rippo/TgBzB/8/

于 2013-04-25T12:06:22.480 回答
0 
select: function(e) {

.... e.preventDefault();

}

不允许您搜索相同的关键字（立即输入）。如果您逐个字符地键入相同的关键字并给出几毫秒的时间，它将起作用。

于 2016-06-10T11:51:39.880 回答
0

即使您使用 MVVM 绑定到多选值，这也可以正常工作。

select: function(e) {
    var widget = $('#widgetId').data('kendoMultiSelect');
    widget.input.val('');
}
于 2017-02-22T12:54:16.180 回答
-3

只需使用它，您就可以清除自动完成

       $("#autoCompleteName").val("");
于 2013-10-07T09:44:08.137 回答