Why my sortable function does not work in rails?

I want to drag and sort the div of id="sortable" class="sort". I use the function of sortable, but it does not work. Anybody can give advice?

$(document).on('change', '.my_class',  function() {
    $target = $(this).closest('.question').find('.option')
    if (this.value == "SINGLE OPTION" || this.value == "OPTIONS") {
        $target.show();
    } else {
        $target.hide();
    }
});
    
$( function(){
   $('.sort').sortable();
});

<div id="sortable" class="sort"> 
  <%= f.fields_for :questions do |question_form| %>            
    <div class="question">
      <%= question_form.text_field :question_text %>
      <%= question_form.select(:question_type, [ 'TEXT','SINGLE OPTION', 'OPTIONS', 'UPLOAD' ],{:prompt => 'Select One'}, :class => "my_class") %>
      <%= question_form.link_to_remove "Remove this Question" %>
      <%= question_form.fields_for :options do |option_form| %>
        <%= option_form.text_field :option_text %>
        <%= option_form.link_to_remove "Remove this option" %>
      <% end %>
      <div class="option" hidden>
        <%= question_form.link_to_add "Add a option", :options %>
      </div>
    </div>
  <% end %>
</div>

Answer

My solution is to use turbolinks.

$(document).on( 'turbolinks:load', function(){
    $('.questions').sortable();
});

Advertisement

Answer