2012-02-15 10 views
2

検索フィールドにjQueryオートコンプリートを使用しています。オートコンプリートソースが0の結果の応答を返すと、オートコンプリートは壊れています。オートコンプリートの末尾にヘルパーメッセージを追加するにはどうすればよいですか?jqueryの最後にヘルパーメッセージを追加する方法オートコンプリート

私は、ヘルパーメッセージがフォーカスに表示され、いつでも0以上の結果が表示されるようにしたいと思います。

 var me = this, 
      cache = {}, // Autocomplete Caching (not built into jQuery UI by default) 
      lastXhr, 
      ac_div = $("#header-search-q"); 

     ac_div.autocomplete({ 
      appendTo: "#header-search", 
      source: function(request, response) { 
       var term = request.term.toLowerCase(); 
       if (term in cache) { 
        response(cache[ term ]); 
        return; 
       } 
       lastXhr = $.getJSON("https://stackoverflow.com/users/search", _(request).extend({'q_type':'all'}), function(data, status, xhr) { 
        cache[ term ] = data.users; 
        if (xhr === lastXhr) { 
         response(data.users); 
        } 
       }); 
      } 
     }) 
     .data("autocomplete")._renderItem = function(ul, item) {   
      return $('<li></li>') 
      .data("item.autocomplete", item) 
      .append("<a>" + item.label + "</a>") 
      .appendTo(ul); 
     }; 
    } 

がどのように私は常にオートコンプリートで、このようなLIを持つことができます:あなたはおそらく、あなたのsourceに小さなハックを行うことができます

<li class="helper">Can't find them?</a> 

おかげ

答えて

1

をここに私はこれまでにしたものです次のようになります。

source: function(request, response) { 
       var term = request.term.toLowerCase(); 
       if (term in cache) { 
        response(cache[ term ]); 
        return; 
       } 
       lastXhr = $.getJSON("https://stackoverflow.com/users/search", _(request).extend({'q_type':'all'}), function(data, status, xhr) { 
        cache[ term ] = data.users; 
        if (xhr === lastXhr) { 
         /* Hack follows: */ 
         if(!data.users.length) data.users.push("Can't find them?"); 
         response(data.users); 
        } 
       }); 
      } 

最近私はオートコンプリートソースコードと私はそれが明確で簡単にカスタマイズし、その動作を変更することがわかったので、これは別の方法です。

関連する問題