2014-04-30 29 views
6

Staram się, aby Twitter Typeahead + Bloodhound działał z Google CSE.Używanie Typeahead z Google Custom Search Engine

Do tej pory udało mi się uzyskać wyniki wracające, ale nie jestem w stanie opracować tego obiektu.

var results = new Bloodhound({ 
    datumTokenizer: function(data) { 
    return Bloodhound.tokenizers.whitespace(d.value) 
    }, 
    queryTokenizer: Bloodhound.tokenizers.obj.whitespace, 
    remote: { 
    url: "http://clients1.google.com/complete/search?client=partner&hl=en&sugexp=gsnos%2Cn%3D13&gs_rn=25&gs_ri=partner&partnerid=004914516364918182382%3Ayfqw09r4qvu&types=t&ds=cse&cp=3&gs_id=15&q=%QUERY&callback=showResults&duffCallback=?", 
    ajax: $.ajax({type:'GET',dataType:'jsonp',jsonp:'duffCallback'}), 
    filter: showResults 
    } 
}); 

Zobacz skrzypce: http://jsfiddle.net/thugsb/3KAjh/

Zobaczysz, że mam wyniki są zwracane z showResults() jako tablicę. Jednak wywołanie showResults() z filter: nie wydaje się nic robić, ponieważ usunięcie tej linii nie ma żadnego efektu. Więc nie jestem całkiem pewien, co się dzieje.

Uwaga: duffCallback jest tym, co opracowałem na podstawie czytania this question. Jeśli jest lepszy sposób, żeby to zadziałało, jestem tylko uszy!

Odpowiedz

7

Po pierwsze, używany datumTokenizer nie był całkiem odpowiedni. Trzeba go zmienić na:

datumTokenizer: function(data) { 
return Bloodhound.tokenizers.whitespace(data.value) 
} 

Zauważ, że funkcja „spacja” jest teraz odwołanie do „dane” parametr wejściowy zamiast „d” którego używaliśmy.

chodzi o aa rozwiązanie problemu, to widzę tu pracować (na przykład spróbuj wyszukać „lekkoatletyce”):

http://jsfiddle.net/Fresh/FYavC/

Głównym problemem z kodem był w swoim zdalnego adresu URL (i to też mnie zdezorientował!). Niepoprawne parametry ciągu zapytań to:

...&callback=showResults&duffCallback=? 

"duffCallback =?" nie jest wymagane, ponieważ określenie "datatype:'jsonp'" w obiekcie ajax automatycznie dodaje szczegóły wywołania zwrotnego (np. "? callback =?") używane przez żądanie jsonp. Również "callback = showResults" nie jest wymagany, ponieważ metoda filtru jest niejawnie wywoływana przez framework Bloodhound, gdy zostanie wykonane pomyślne żądanie jsonp.

Zgadzam się, że nie jest oczywiste, w jaki sposób należy nawiązywać połączenia zdalne podczas korzystania z Typeahead.js. Przykład zdalnego połączenia, w którym określony jest obiekt ajax, a część dokumentacji byłaby przydatna na stronie Typeahead.js!