0

私は自分のレールアプリケーションにオートコンプリートフォームを実装しようとしています。Rails 4オートコンプリートフォーム

これまでのところ、次のインストール手順を実行しました。

Gemfileが追加さ:

gem 'jquery-rails' 
gem 'jquery-ui-rails' 
gem 'rails4-autocomplete' 

Application.js、コメントを追加しました:私のモデルで

//= require jquery 
//= require jquery_ujs 
//= require jquery-ui/autocomplete 
//= require autocomplete-rails 

は、私が仕事や会社を持っています。 Job belongs_to CompanyおよびCompany has_many Jobsである。私が持っている私のroutes.rbをで

resources :companies 
resources :jobs do 
    get :autocomplete_company_name, :on => :collection 
end 

ジョブズトップに追加コントローラ:

autocomplete :company, :name 

すべての仕事の成り日付で、その後、企業などのテーブルへの外部キー、連絡先、求人サイトなどジョブの新しい_フォーム私は:

<%= form_for(@job) do |f| %> 
    <%= f.hidden_field :date, :value=>Time.now %> 
    <%= f.hidden_field :user_id, :value=>current_user.id %> 

    <%= f.fields_for :company, @company do |company| %> 
     <%= company.autocomplete_field :name, autocomplete_company_name_jobs_path %> 

私はオートコンプリートフィールドをレンダリングすることができますn私の形式ですが、入力を開始すると何も表示されません。 Home Depotは私のテストデータベースの私のダミー企業の1つですが、私が "Ho"と入力すると何も自動完成しないように見えます。

enter image description here

私はそうのように表示され、レンダリングしていますオートコンプリートフィールドのページのソース:

<input data-autocomplete="/jobs/autocomplete_company_name" type="text" name="job[company][name]" id="job_company_name" /> 

私はここで見つけるドキュメントおよび指示に従ってきた。https://github.com/bigtunacan/rails-jquery-autocomplete

は何かが私はあります行方不明ですか?私は含まれていないいくつかのjavascriptファイルやスクリプト/関数など、私のapplication.jsで実行する必要がありますか?または、私のapplication.htmlのjavascript_include_tag?

jQueryとjavascriptを初めて使用しています。

答えて

0

オンラインで他の例を検索したところ、その答えが見つかりました。

まず、少しオフでした。 autocomplete :company, :nameは私の会社のコントローラに必要とし、get :autocomplete_company_name, :on => :collectionは私のcompaniesリソースにネストする必要がありました。

宝石のドキュメントがこれを見逃しているのは分かりませんが、宝石の仕事をするために自分のjs.erbファイルを作成し、javascript関数を追加する必要がありました。 app/assets/javascripts

私はcompany.js.erbを作成し、以下の機能を追加しました:

$(function() { 
    var companies = <%Company.all.collect{|company| company.name}%> 
    $("#jobCompany").autocomplete({ 
     source: companies 
    }); 
    }); 

欠落していたことすべて、私はそれが必要としてすべてが働いていたサーバーを回復した後でした。

注意、あなたはオートコンプリートの提案がきれいにフォーマットすることがしたい場合は、app/assets/stylesheets/application.scss*= require jquery-ui

を追加