在Rails項目的導航欄中添加自動完成

我正在運行一個由所有頁面上的Navgation欄組成的Rails項目。我還在導航欄上有一個輸入標籤用於搜索目的，但是如何在特定搜索欄中實現自動填充。在Rails項目的導航欄中添加自動完成

我嘗試使用rails-jquery-autocomplete並實現了它詢問的方式，但不幸的是它沒有爲我工作。沒有搜索結果上可以看到屏幕上或控制檯

brands_controller.rb

class Admin::BrandsController < Admin::AdminController 
    autocomplete :brand, :name 
end

的routes.rb

resources :brands, param: :uuid do 
    get :autocomplete_brand_name, :on => :collection 
end

_navigationbar.html.erb

<form class="navbar-form pull-left" role="search"> 
    <div class="form-group"> 
     <input type="text" class="form-control search-bar" placeholder="Type here for search..." data-autocomplete="<%=autocomplete_brand_name_admin_brands_path%>"> 
    </div> 
</form>

的Gemfile

gem 'rails', '~> 5.0.0' 
gem 'rails-jquery-autocomplete' 
gem 'jquery-rails'

的application.js

//= require jquery 
//= require jquery_ujs 
//= require moltran/modernizr.min 
//= require moltran/bootstrap.min 
//= require tagsinput/jquery.tagsinput.min.js 
//= require autocomplete-rails

生成的HTML：

<div class="form-group"> 
    <input type="text" class="form-control search-bar" placeholder="Type here for search..." data-autocomplete="/admin/brands/autocomplete_brand_name"> 
</div>

來源

2016-10-20 Syed Asad Abbas Zaidi

安置自己的代碼替換輸入標籤。 – dnsh

@Dinesh我已經更新了代碼。請檢查 –

您可以發佈您的Gemfile和的application.js – dnsh

您在application.js中缺少//= require jquery-ui/autocomplete。更新的application.js到

//= require jquery 
//= require jquery_ujs 
//= require moltran/modernizr.min 
//= require moltran/bootstrap.min 
//= require tagsinput/jquery.tagsinput.min.js 
//= require jquery-ui/autocomplete 
//= require autocomplete-rails

在你的Gemfile添加

gem 'jquery-ui-rails'

還與

<%=autocomplete_field_tag 'search', '', autocomplete_brand_name_admin_brands_path %>

來源

2016-10-20 07:23:45 dnsh

找不到類型爲'application/javascript'的文件'jquery-ui/autocomplete' –

Rails 5.0.0.1是版本 –

@SyedAsadAbbasZaidi在您的gemfile添加'gem'jquery-ui-rails''然後執行'bundle install'並重新啓動服務器。 – dnsh

在Rails項目的導航欄中添加自動完成

回答

相關問題