2015-11-20 8 views
13

La funzionalità type ahead funziona dove dovrebbe. Il problema però è che la funzionalità type ahead sta facendo la richiesta JSON su ogni richiesta per i dati quando in realtà dovrebbe accadere solo per una richiesta specifica.Typeahead in rails app: aggiungi la richiesta JSON a una sola richiesta specifica invece di aggiungere la richiesta JSON ad ogni richiesta tramite prefetch

ho il seguente controller:

#controllers/agencies_controller.rb 
class AgenciesController < ApplicationController 

    def get_unique_agency_names 
    @unique_agency_names = Agency.uniq.pluck(:name) 
    respond_to do |format| 
     format.json { render json: @unique_agency_names } 
    end 
    end 
    ... 
end 

Ho il seguente nel mio file javascript:

#app/assets/javascripts.agencies/index.js 
$(document).ready(function(){ 
    /* For typeahead functionality on name input of search form for agencies */ 
    var agency_names = new Bloodhound({ 
    datumTokenizer: Bloodhound.tokenizers.whitespace, 
    queryTokenizer: Bloodhound.tokenizers.whitespace, 
    prefetch: '../agencies/get_unique_agency_names.json' 
    }); 

    $('#prefetch .typeahead.name_input').typeahead(null, { 
    name: 'agency_names', 
    source: agency_names 
    }); 
}); 

E proprio per il completamento, qui è l'unico posto dove voglio questa funzionalità accada : in questa forma:

# just showing the relevant part of the form 
<div class="form-group" id="prefetch"> 
    <%= f.label :name_cont, "Agency Name" %> 
    <%= f.text_field :name_cont, class: "form-control typeahead name_input", placeholder: "Enter Agency Name" %> 
</div> 

Ecco il mio percorso rilevante in config/routes.rb

resources :agencies do 
    collection do 
    get 'get_unique_agency_names' 
    end 
end 

La mia domanda specifica è: come posso garantire che il GET "/agencies/get_unique_agency_names" viene chiamato solo quando si suppone che? In questo momento sta aggiungendo questa richiesta JSON per ogni richiesta. Voglio solo che la richiesta JSON si verifichi per una richiesta specifica.

Twitter's Type Ahead Examples

+1

Non è solo la cosa 'prefetch'? "I dati prefetched vengono recuperati ed elaborati durante l'inizializzazione." –

+0

@DaveNewton Ci stavo pensando. Non sono sicuro di cosa dovrei mettere al suo posto. – Neil

+2

Non precaricare? Solo prefetch sulle pagine in cui è significativo? Il repository Bloodhound elenca le opzioni di prefetch che è possibile utilizzare. Se è su ogni richiesta, significa che questo JS viene incluso anche nelle pagine per le quali non ha importanza e l'URL non assoluto significa che aggiungerà l'URL a qualsiasi pagina visualizzata. –

risposta

3

penso che hai bisogno di questo

$('#prefetch .typeahead.name_input').typeahead(null, { 
    generateOnLoad:false, 
    name: 'agency_names', 
    source: agency_names 
    }); 

generateOnLoad{boolean}

null (impostazione predefinita) Se abilitata, verrà generato

i dati di origine (facendo richiesta Ajax e preparando i dati a essere cercato) sul caricamento della pagina invece di attendere che l'input sia focalizzato.

PN: questa opzione non funziona bene con dynamic: true a meno che non venga regolata qualche altra configurazione.

Inoltre, se voi trovano i binari file manifesto aggiunge la chiamata a ogni pagina basta controllare elemento esiste prima di tipo avanti è destinato:

if($('#prefetch .typeahead.name_input').length){ 
     $('#prefetch .typeahead.name_input').typeahead(null, { 
     generateOnLoad:false, 
     name: 'agency_names', 
     source: agency_names 
     }); 
} 
3

vorrei suggerire una strategia per “limitanti” richieste, piuttosto che imposizione programmatica di una singola richiesta, in quanto sembra che si tratti di un set di dati di grandi dimensioni. È possibile impostare l'opzione prefetch di Bloodhound per memorizzare nella cache ciò che è possibile e le opzioni sufficient e remote per garantire che le richieste per il file JSON siano riempite di nuovo e a velocità limitata. Imposta un valore più alto per l'opzione di Typeahead come ultima linea di difesa.

Prefetch ti servirà a un livello, in quanto dipende dalla memoria locale del browser per la memorizzazione nella cache, che ha una capacità limitata. Se il set di dati è ampio, memorizzerà solo una parte della cache e saranno necessarie ulteriori richieste dopo l'inizializzazione.

Remote gestisce le richieste dopo l'inizializzazione e può annullare o limitare queste richieste per voi, riducendo così il numero di richieste effettuate.Vedere le opzioni url, rateLimitBy e rateLimitWait, che possono essere assegnate a remote come hash. Inoltre, Bloodhound utilizzerà remote per eseguire il back-fill di datum aggiuntivi se non viene raggiunto il conteggio dell'origine sufficient.

Infine, non passare null e impostare l'opzione minLength su un valore superiore a quello predefinito di 1 sul costruttore Typeahead. Ciò impedirà ricerche eccessivamente abbondanti sul set di dati. Basta essere sicuri che il valore minLength sia più corto della lunghezza del risultato più piccolo e possibile.

Problemi correlati