Rails 5, Simple Form with Select2-rails

Question

I'm trying to figure out how to use select2 with simple form in my rails 5 app.

I am using acts as taggable on in the app.

I have installed this gem in my gem file:

gem 'select2-rails'

I tried to install this gem in my gemfile, but I get an error saying that it cant be found. I'm wondering if it isnt compatible with Rails 5 (given the last update was 2015).

# gem 'select2_simple_form'

My objective is to make a form input field that users can complete by selecting 5 predefined tags available on the tagged model.

I've tried the solutions put forward in this post and this post and I've tried every example in this documentation stream. I cant get any of them working.

In my application.js, I have:

//= require select2

I have also tried each of these:

// $(document).ready(function() {
//   $(".js-example-basic-multiple-limit").select2({
//   maximumSelectionLength: 2
//   });
//
// });

$(document).ready(function() {
  $('.multiple-input').each(function() {
    $(this).select2({
      tags: true,
      tokenSeparators: [','],
      theme: 'bootstrap',
      placeholder: 'Separated by comma'
      });
    });
});

$(document).ready(function() {
  $('.input-row #proposal_randd_field_list, .input-row #proposal_randd_field_list').select2({tags:[]})
});

I cant get this to work at all. When I inspect the google console - I don't get any js errors, but I also don't get a working select 2 functionality. I can just select in the ordinary way that simple form allows from a drop down menu.

My objective is to have the content of my Randd::Field model (which has an attribute called :title; those titles are the tags on the proposal model and stored in a randd_field_list in that proposal model) accessible as a searchable, drop down list as shown here (under the heading Loading remote data).

Does anyone know how to achieve this in rails using simple form. The documents don't line up at all.

My current attempt is:

<%= f.collection_select :randd_field_list, Randd::Field.order(:title),  :title, :title, {:selected => @proposal.randd_field_list, :include_blank => true}, input_html: {:class => 'multiple-input', :multiple => true} %>

The above does not allow me to select multiple tags (with any variation of the application.js function enabled).

I have also tried:

<!-- <select class="js-example-basic-multiple" multiple="multiple"> -->
<!--<input type="hidden" id="ajax-example" /> -->

<%#= f.label :randd_field %>
<%#= f.collection_select :randd_field_list, Randd::Field.order(:title),  :title, :title,  input_html: { class: 'multiple-input', multiple: "multiple" } %>

<%#= f.collection_select :randd_field_list, Randd::Field.order(:title),  :title, :title, {:selected => @proposal.randd_field_list, :include_blank => true} %>
<!-- </select> -->
  <!-- <select class="js-example-basic-multiple" multiple="multiple"> -->
     <!-- <option value="AL">Alabama</option>
     <option value="WY">Wyoming</option>
 </select> -->
        <%#= f.text_field :randd_field_list, input_type: "textbox", name:"proposal[randd_field_list][]", html_options: { style: 'width: 100%' } %>
        <%#= f.collection_select :randd_field_list, Randd::Field.order(:title),  :title, :title, {} %>
        <%#= f.input 'randd_field_list',
       options_from_collection_for_select(@randd_fields, :title, :title),
       multiple: true %>
       <%#= f.collection_select 'randd_field_list',
      options_from_collection_for_select(@randd_fields, :title, :title),
      multiple: true %>
       <%#= f.input :randd_field_list,:collection => @randd_fields,:label_method => :title,:value_method => :title,:label => "Fields" ,:include_blank => false, :multiple => true %>

None of these work.

Answer 1

I ran across your post looking for some Rails 5 update info. I'm a newbie, but I'm grappling with the problem of too many small gems. I'm wondering if you shouldn't give up on select2 and do what you need using just simple_form ? Just a thought because I have no idea how to handle tags as you're trying to do.

Good luck.