Select2 is not showing search option in Drop Down?

924 Views Asked by At

I have integrated select2 with my active admin. But it is not working properly. It only showing the drop down without the search option.

I have followed the following link: (Select2-rails is not working with ActiveAdmin)

Used Ruby Version: ruby-2.6.3 [ x86_64 ] Rails Version: Rails 5.0.7.2

This is my app/assets/javascripts/application.js

//= require jquery
//= require jquery_ujs
//= require bootstrap.min
//= require_tree .
//= require select2
//= require select2_locale_pt-BR
$( "#dropdown" ).select2({
language: "zh-TW"
});

This is my app/assets/stylesheets/application.css

 *= require bootstrap
 *= require_tree .
 *= require_self
 *= require select2
 *= require select2-bootstrap

I have used select2 here,

customer_location.input :area, as: :select2, collection: Region.all.map {|u| [u.area.to_s, u.id]}, :input_html => { :class => 'select2-input', :width => 'auto', "data-placeholder" => 'Select Area' }
2

There are 2 best solutions below

1
NN796 On

I used activeadmin-select2 gem which worked fine for me.

Add activeadmin, jquery-rails and select2-rails to your Gemfile:

gem 'activeadmin'
gem 'jquery-rails'
gem 'select2-rails'

And add activeadmin-select2 to your Gemfile:

gem 'activeadmin-select2', github: 'mfairburn/activeadmin-select2'

Add the activeadmin-select2 calls to the active_admin stylesheets and javascripts with:

@import "active_admin/select2/base"; #add this line to your app/assets/stylesheets/active_admin.scss

#= require active_admin/select2 #add this line to your app/assets/javascripts/active_admin.js

Usage:

Filters

Standard :select filters will automagically be converted to Select2 filters. If you want a multi-select combo-box then use:

ActiveAdmin.register Products do
      filter :fruits, as: :select2_multiple, collection: [:apples, :bananas, :oranges]
   end

Select Lists

To use a Select2 style list simply change from :select to :select2 or :select2_multiple

ActiveAdmin.register Products do
     form do |f|
       f.input :fruit, as: :select2
     end
     form do |f|
       f.inputs "Product" do
         f.has_many :fruits, allow_destroy: true, new_record: "Add Fruit" do |e|
           e.input :fruit, as: :select2_multiple
         end
       end
     end
   end
0
nourza On

For me I solve it by appling this gem with select2 gem in the gemfile the search option appears to the dropdown in active admin

gem 'activeadmin-searchable_select'

in active admin add

f.input :address_id, label: "Client Address" , as: :searchable_select, :collection => Address.order(name: :desc).to_a(&:name).collect {|address| [address.name, address.id] }