(jQuery-Autocomplete)清除搜索框后显示所有结果

时间:2013-07-19 14:37:48

标签: jquery asp.net-mvc-4

我对jquery和我构建一个MVC 4网站相当新,这可以按预期工作但是我想处理用户清除搜索条件然后我将表更新到其原始状态的事件

    var submitAutoCompleteForm = function (event, ui) {
    var $input = $(this);
    $input.val(ui.item.label);
    var $form = $input.parents("form:first");
    $form.submit();
};
var createAutoComplete = function () {
    var $input = $(this);
    var options = {
        source: $input.attr("data-otf-autocomplete"),
        select: submitAutoCompleteForm
    };
    $input.autocomplete(options);
};
$("input[data-otf-autocomplete]").each(createAutoComplete);

2 个答案:

答案 0 :(得分:1)

您需要添加此选项以要求0个字符来激活搜索:

minLength:  0

启用此选项后,您只需点击向下箭头,列表就会显示

编辑:

现在我更好地理解了这个问题,您可能需要添加“搜索”选项 搜索选项在从源请求任何内容之前触发,因此它是查看该字段是否为空的最佳位置。

,search: function(event, ui){
             if($(this).val() == ''){
                 //code to show table
             }
         }

您也可以使用更改选项,但根据我的经验,它只会在值发生变化时触发,或者在字段触发模糊事件时更紧密地触发,因此我个人不喜欢它在我的应用程序中的行为

,change: function(event, ui){
             if($(this).val() == ''){
                 //code to show table
             }
         }

答案 1 :(得分:0)

我最终使用的方法与@MonkeyZeus建议基本相同

 $("input[type='search']").keyup("search", function () {
    if (!this.value) {
      //code to update the table

} });