Implementazione rotaie di ricerca con completamento automatico

Question

Non sono sicuro di avere un modulo di completamento automatico per la mia funzione di ricerca.

<%= form_tag "/search", :method => "get" do %> 
    <%= text_field_tag :query, params[:query] %> 
    <%= image_submit_tag "site/blankimg.png", :name => nil %> 
<% end %> 

Ho un controllo dei seguenti elementi ha un'azione personalizzata

def query 
    @users= Search.user(params[:query]) 
    @article= Search.article(params[:query]) 
    end 

Il modello è ha seguire:

def self.user(search) 
if search 
    User.find(:all, :conditions => ['first_name LIKE ?', "%#{search}%"]) 
    else 
    User.find(:all) 
    end 
end 

def self.article(search) 
    if search 
    Article.find(:all, :conditions => ['title LIKE ?', "%#{search}%"]) 
    else 
    Article.find(:all) 
    end 
end 

Ora questo grande per una ricerca di lavoro, ma, io vorrebbe che mi mostri il risultato che sto scrivendo, e non posso usare il completamento automatico jQuery perché è un oggetto due.

Answer 1

Utilizzare Twitter typeahead. Ci sono alcuni esempi qui:

http://twitter.github.com/typeahead.js/examples/

Twitter typeahead e tutte le informazioni necessarie sono disponibili presso https://github.com/twitter/typeahead.js/

Come utilizzare

L'uso dipende dai dati che si sta per avere come 'suggerito'. Ad esempio, se si tratta di dati statici (sempre sarà lo stesso) è possibile implementare in questo modo:

$('input.typeahead').typeahead({ 
    local: ['suggestion1', 'suggestion2', 'suggestion3',...., 'suggestionN'] 
    #The typeahead is going to load suggestions from data in local. 
}); 

Se i dati vengono modificati e ne è venuto da un modello o una tabella db allora si può provare:

Controller: 
def load_suggestions 
    @suggestions = MyModel.select(:name) or MyModel.find(:all, conditions: [...]) #Select the data you want to load on the typeahead. 
    render json: @suggestions 
end 

JS file: 
$('input.typeahead').typeahead([ 
    { 
    prefetch: 'https://www.mipage.com/suggestion.json' #route to the method 'load_suggestions' 
    #This way, typeahead will prefecth the data from the remote url 
    } 
]);