2

jQuery UI オートコンプリート ウィジェットを検索テキスト ボックスにバインドする次の JS メソッドがあります。取得したばかりの結果を再利用しないため、検索用語を追加するときに不要なサーバー呼び出しを行うことを除いて、キャッシュを含め、すべてが正常に機能します。

たとえば、「ab」を検索すると、サーバーからいくつかの結果が取得されます。検索ボックスに「ab」の後に「c」を入力すると、キャッシュされた「ab」の結果を再利用して「abc」に一致しない結果を除外する代わりに、サーバーから「abc」の結果が取得されます。

「ab」検索結果を手動で検索し、正規表現を使用してそれらをフィルタリングして「abc」サブセットを選択する道をたどりましたが、これは完全に車輪の再発明のようです。ウィジェットに「ab」の結果を使用するように指示するが、「abc」の用語でそれらをフィルタリングし、短縮されたドロップダウンを再表示する適切で標準的な方法は何ですか?

function bindSearchForm() {
    "use strict";
    var cache = new Object();

    $('#search_text_field').autocomplete({
        minLength: 2,
        source: function (request, response) {
            var term = request.term;
            if (term in cache) {
                response(cache[term]);
                return;
            }
            $.ajax({type: 'POST',
                    dataType: 'json',
                    url: '/get_search_data',
                    data: {q: term},
                    success: function (data) {
                        cache[term] = data;
                        response(data);
                    }
            });
    });
}
4

2 に答える 2

2

これが私の「力ずくで車輪を再発明する」方法で、今のところ、これが正しい解決策のように見えます。

function bindSearchForm() {
    "use strict";
    var cache = new Object();
    var terms = new Array();

    function cacheNewTerm(newTerm, results) {
        // maintain a 10-term cache
        if (terms.push(newTerm) > 10) {
            delete cache[terms.shift()];
        }
        cache[newTerm] = results;
    };

    $('#search_text_field').autocomplete({
        minLength: 2,
        source: function (request, response) {
            var term = request.term.toLowerCase();
            if (term in cache) {
                response(cache[term]);
                return;
            } else if (terms.length) {
                var lastTerm = terms[terms.length - 1];
                if (term.substring(0, lastTerm.length) === lastTerm) {
                    var results = new Array();
                    for (var i = 0; i < cache[lastTerm].length; i++) {
                        if (cache[lastTerm][i].label.toLowerCase().indexOf(term) !== -1) {
                            results.push(cache[lastTerm][i]);
                        }
                    }
                    response(results);
                    return;
                }
            }
            $.ajax({type: 'POST',
                    dataType: 'json',
                    url: '/get_search_data',
                    data: {q: term},
                    success: function (data) {
                        cacheNewTerm(term, data);
                        response(data);
                        return;
                    }
            });
    });
}
于 2013-01-03T17:27:53.547 に答える