JQuery UI Autouzupełnianie za pomocą statycznego pliku json jako źródła

używamjquery-ui-autocomplete (właściwie acatcomplete dołączony do pola wyszukiwania). Działa dobrze, jeśli jako źródło używam statycznej tablicy elementów.

Ze względu na wydajność nie chcę, aby autouzupełnianie wysyłało żądania Ajax do skryptu PHP, dzięki czemu% przypomina% żądań do MySQL. Więc,Wygenerowałem plik JSON z bazy danych, zawierający każdy element, który można dopasować w wyszukiwaniu (około 20-30 elementów, z wielu tabel sql). Chciałbymodczytaj / przeanalizuj plik tylko raz, gdy strona ładuje się lub gdy użytkownik zaczyna wpisywać w polu wyszukiwania.

Utknąłem tutaj. Próbowałem dołączyć wywołanie Ajax do .catcomplete () (kod poniżej). Próbowałem również wywołać getJSON i utworzyć .catcomplete w swojej metodzie success ().Obie drogi zawodzą cicho.

Jestem trochę nowy w materiałach JS / jQuery, już to lubię, ale jestem trochę zagubiony. Każda pomoc / rozwiązanie / wskaźnik do użytecznego dokumentu będzie bardzo mile widziane.

Dziękuję Ci bardzo!

Oto HTML: (naprawdę prosty)

<form id="searchform" method="get" role="search">
    <input id="searchfield" />
    <input type="submit" name="go" value="go!" />
</form>

Oto mój kod JS:

$( "#searchfield" ).catcomplete({
delay: 0,
source: function( request, response ) {
    $.ajax({
        url: "/path/to/cache.json",
        dataType: "json",
        data: {term: request.term},
        success: function(data) {
            response($.map(data, function(item) {
                return {
                    label: item.label,
                    category: item.category,
                    desc: item.desc
                };
            }));
        }
    });
},
minlength:0
});

Przykładowe dane JSON:

[
{ label: "lbl1", category: "cat1", desc: "desc1"}, 
{ label: "lbl2", category: "cat1", desc: "desc2"}, 
{ label: "lbl3", category: "cat1"}
]

questionAnswers(2)

yourAnswerToTheQuestion