2013-08-02 10 views
11

Próbuję zrobić podobny przykład, co Twitter pokazuje na stronie przykładów, a konkretnie ten z szablonem o nazwie Open Source Projects by Twitter i mam coś częściowo działającego, ale tylko i zawsze pokaż tylko 1 wiersz wyniku, mimo że ustawiłem go na 10, pobieram dane Yahoo Finance, a wynik jest JSON i jest ważny w Firebug, na przykład wpisanie litery "a" spowoduje podobny obiekt JSON: [Object { symbol="A", name="Agilent Technologies Inc.", exch="NYQ", more...}, Object { symbol="^DJI", name="Dow Jones Industrial Average", exch="DJI", more...}, more objects...]Twitter TypeAhead z szablonem zawsze zwraca tylko 1 wiersz danych

Mój plik JS ma taką konfigurację wpisywanie znaków z wyprzedzeniem

$('.symbols .typeahead').typeahead({ 
    //name: 'symbols', 
    //remote: 'yahoo_autocomplete_ajax.php?action=autocjson&symbol=%QUERY', 
    limit: 3, 
    remote: { 
     url: 'yahoo_autocomplete_ajax.php?action=autocjson&symbol=%QUERY', 
     filter: function(parsedResponse) { 
      var dataset = []; 

      dataset = parsedResponse.data; 
      console.log(parsedResponse.data); 
      console.log(dataset); // debug the response here 

      return dataset; 
     } 
    }, 
    //prefetch: 'symbols.json', 
    template: [ 
     '<p class="symbols-exchange">{{exchDisp}}</p>', 
     '<p class="symbols-symbol">{{symbol}}</p>', 
     '<p class="symbols-name">{{name}}</p>' 
    ].join(''), 
    engine: Hogan 
}); 

z con sole.log zarówno parsedReponse.data, jak i dataset wyświetlają poprawną tablicę. ale na końcu zawsze pokazuje pierwszy wynik bez względu na to, co i jak działa szablon, tak jak powinien, teraz w moim kodzie HTML mam przykłady z Twittera i zawsze pokazuje wszystkie wyniki, ale moje tylko 1 .. więc dlaczego? Jeśli to konieczne, mogę również opublikować mój kod HTML, próbuję tylko zrobić przykład, więc kod HTML jest nadal prosty

Mam również 2. problem, gdy pokazuje, że 1 wynik nawet po kliknięciu to, aby go wybrać, nic nie pojawia się w moim wejściu, choć chciałbym mieć wartość symbolu

Oto fragment mojego kodu HTML

<form> 
     <div class="example symbols"> 
      <h2 class="example-name">Symbols</h2> 
      <p class="example-description">Defines a custom template and template engine for rendering suggestions</p> 

      <div class="demo"> 
       <input class="typeahead" type="text" placeholder="symbol"> 
      </div> 
     </div> 
    </form> 

Odpowiedz

27

po kilku dniach pracy w tej sprawie po godzinach pracy, W końcu to znalazłem ... Zapomniałem 1 małej rzeczy, która teraz odpowiada na moje oba problemy. Zapomniałem tego małego kawałka kodu w moim JS: valueKey: 'symbol' i voila !!! Dlatego nie widziałem niczego w danych wejściowych nawet po wybraniu jedynego wyświetlanego wiersza (mój problem nr 2), a także dlaczego pokazywał tylko 1 wiersz sugestii. Teraz dla czystszego kodu wymyśliłem to:

$('.symbols .typeahead').typeahead({ 
    limit: 5, 
    valueKey: 'symbol', 
    remote: { 
     url: 'yahoo_autocomplete_ajax.php?action=autocjson&symbol=%QUERY', 
     filter: function(parsedResponse) { 
      return parsedResponse.data; 
     } 
    }, 
    template: [ 
     '<p class="symbols-exchange">{{exchDisp}}</p>', 
     '<p class="symbols-symbol">{{symbol}}</p>', 
     '<p class="symbols-name">{{name}}</p>' 
    ].join(''), 
    engine: Hogan 
}); 
+0

Dobrze, że masz go rozwiązać;) –

+1

Dzięki, nie widzę, że brakowało mi ten kawałek, ponieważ nie jest to konieczne, na tablicy napis, i odkąd zacząłem od sznurków, a potem po obiektach, nadzorowałem ten kawałek ... – ghiscoding

+1

Dziękuję. To bardzo pomocne! – Dmitriy

Powiązane problemy