Рельсы Поисковая форма работает только после перезагрузки страницы

Question

У меня есть форма поиска в представлении «Слайды», ведьма демонстрирует динамические результаты для Anagraphic model в div. Проблема в том, что когда страница индекса скольжения загружается в первый раз, поиск не работает динамически, а только после нажатия кнопки поиска. После того, как я перезагрузите страницу, поиск будет прекрасным, отображая результаты динамически после ввода символов в поле поиска.

Это моя Anagraphic модель

def self.search(search) 
if search 
    where('description LIKE :search OR code LIKE :search ', search: "%#{search}%") 
else 
    all.limit(2) 
end 
end 

Это мой SlipsController:

def index 

    @visibleanagraphics = Anagraphic.where("laundryowner_id = ?", current_owner.id) 
    @anagraphics = @visibleanagraphics.search(params[:search]) 

    respond_to do |format| 
    format.js 
    format.html 
    end 

end 

На мой взгляд Индекс проскальзывает у меня есть:

<%= form_tag '/slips', :method => 'get', :id => "anagraphics_search" do %> 
    <%= text_field_tag :search, params[:search], :autocomplete => :off %> 
    <%= submit_tag "°", :description => nil, class:"btn btn-primary btn-sm" %> 

    <div id="anagraphics"> 
    <%= render "anagraphics" %> 
    </div> 

Результаты отображаются в это частичное:

<table class="table table-striped table-bordered"> 
    <thead> 
     <tr> 
      <th>Codice</th> 
      <th>Descrizione</th> 
      <th>Cliente</th> 
      <th colspan="1"></th> 
     </tr> 
    </thead> 
    <tbody> 
     <% @anagraphics.each do |anagraphic| %> 
     <tr> 
      <td><%= anagraphic.code %></td> 
      <td><%= anagraphic.description %></td> 
      <td><%= anagraphic.customer %></td> 
      <td><%= link_to 'crea cedolino', {controller: 'slips', action: 'new', aid: anagraphic.id}, class: "btn btn-primary btn-sm" %></td> 
     </tr> 
     <% end %> 
    </tbody> 
</table> 

Это Java-код slips.js

$(document).ready(function() { 
    $("#anagraphics_search input").keyup(function() { 
    $.get($("#anagraphics_search").attr("action"), $("#anagraphics_search").serialize(), null, "script"); 
    return false; 
    }); 
}); 

И, наконец, моя index.js.erb:

$("#anagraphics").html("<%= escape_javascript(render("anagraphics")) %>") 

Answer 1

Это может быть потому, что у вас есть turbolinks включены. Это повлияет на ваш вызов jQuery $(document).ready(function() {...}), так как turbolinks в основном кэширует страницу и только перезагружает всю страницу при обновлении, вот почему она, вероятно, работает после, вы это делаете.

Хороший вариант - попытаться использовать gem jquery.turbolinks, который предназначен для решения этой проблемы. Посмотрите, как включить его в ваше приложение по следующей ссылке:

https://github.com/kossnocorp/jquery.turbolinks

Answer 2

Возможно у вас есть эта ошибка по turbolinks. Попробуйте это вместо ready

$(document).on('turbolinks:load', function() { 
    $("#anagraphics_search input").keyup(function() { 
    $.get($("#anagraphics_search").attr("action"), $("#anagraphics_search").serialize(), null, "script"); 
    return false; 
    }); 
});