Integrate Chosen javascript library with Rails asset pipeline
Chosen is a library for making long, unwieldy select boxes more user friendly.
The chosen-rails
gem integrates the Chosen
into Rails asset pipeline with the sprockets-rails.
Include chosen-rails
in Gemfile
gem 'jquery-rails'
gem 'chosen-rails'
Then run bundle install
You can get jquery via jquery-rails.
Please consider jquery-turbolinks if you have turbolinks issues for Rails 4 +.
Add to your app/assets/javascripts/application.js
if use with jQuery
//= require jquery
//= require chosen-jquery
Or with Prototype
//= require jquery
//= require chosen-prototype
Add to your app/assets/stylesheets/application.css
*= require chosen
For rails 6, remember to add javascript_include_tag
in app/views/layouts/application.html.erb
, like
<%= javascript_include_tag 'application' %>
Add to one coffee script file, like scaffold.js.coffee
$ ->
# enable chosen js
$('.chosen-select').chosen
allow_single_deselect: true
no_results_text: 'No results matched'
width: '200px'
Notice: width
option is required since Chosen 0.9.15
.
And this file must be included in application.js
//= require chosen-jquery
//= require scaffold
Also add the class to your form field
<%= f.select :author,
User.all.map { |u| [u.name, u.id] },
{ include_blank: true },
{ class: 'chosen-select' }
%>
If you use simple form as form builder
<%= f.association :author,
collection: User.all,
include_blank: true,
input_html: { class: 'chosen-select' }
%>
Since version 0.13.0, non-digested assets of chosen-rails
will simply be copied from digested assets.
chosen-rails
provides RSpec feature helper methods that allow users to select or unselect options from both single and multiple chosen elements. Add the following to your spec/rails_helper.rb
(or spec/spec_helper.rb
):
require 'chosen-rails/rspec'
This automatically configures RSpec by adding:
RSpec.configure do |config|
config.include Chosen::Rspec::FeatureHelpers, type: :feature
end
Configuration includes two additional methods for all type: :feature
specs:
chosen_select(value, options = {})
chosen_unselect(value, options = {})
Both methods require from: '...'
inside the options
hash that is either a CSS selector or a field’s label (requires the for
attribute on the label!).
To handle a single select:
chosen_select('Leo Tolstoy', from: 'Author')
chosen_unselect('Leo Tolstoy', from: '#author')
chosen_select('Fyodor Dostoyevsky', from: '#author')
To handle a multiple select:
chosen_select('Leo Tolstoy', 'Fyodor Dostoyevsky', 'Anton Chekhov', from: 'Authors')
# or, by single value:
chosen_select('Leo Tolstoy', from: '#authors')
chosen_unselect('Fyodor Dostoyevsky', ' Anton Chekhov', from: 'Authors')
# or, by single value:
chosen_unselect('Leo Tolstoy', from: '#authors')
Maintain chosen-rails
gem with Rake
commands.
Update origin chosen source files.
rake update-chosen
Publish gem.
rake release
use MIT license.