Question

我可以在每个页面中使用搜索栏，但在刷新页面之前我无法使用自动完成功能。

您可以在此链接中找到“layouts / header.html.erb”，“用户模型”，“users_controller”，“routes.rb”Autocompleted search form is not working in all pages

的Gemfile

 gem 'rails', '4.2.4'
 gem 'bcrypt', '~> 3.1.7'
 gem 'faker',                '1.4.2'
 gem 'carrierwave',             '0.10.0'
 gem 'mini_magick',             '3.8.0'
 gem 'fog',                     '1.36.0'
 gem 'will_paginate',           '3.0.7'
 gem 'bootstrap-will_paginate', '0.0.10'
 gem "searchkick"

 gem 'uglifier', '>= 1.3.0'

 gem 'jquery-rails'
 gem 'jquery-ui-rails'

 gem 'turbolinks'

 gem 'jbuilder', '~> 2.0'

 gem 'sdoc', '~> 0.4.0', group: :doc

 gem 'bootstrap-sass', '~> 3.2.0'
 gem 'autoprefixer-rails'
 gem 'make_flaggable', :git => 'git://github.com/medihack/make_flaggable'

application.html.erb

 <head>
     <title><%= yield(:title) %> | Blogger </title>
     <%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track' => true %>
     <%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>

     <!-- Using it for autocomplete --> 

     <%= javascript_include_tag "//cdnjs.cloudflare.com/ajax/libs/typeahead.js/0.9.3/typeahead.min.js" %>

     <!--         -->

      <      %= csrf_meta_tags %>
            <%= render 'layouts/shim' %>
 </head>

布局/垫片

<!--[if lt IE 9]>
   <script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/r29/html5.min.js">
   </script>
<![endif]-->

user.js.coffee

 $ ->
    $('#user_search').typeahead
       name: "user"
       remote: "/users/autocomplete?query=%QUERY"

Answer 1

＆＃34;关于使用turbolinks的事情是，大多数绑定到文档就绪事件的插件和库都停止工作，因为turbolink会阻止浏览器重新加载页面。＆＃34;

答案来自此链接。 JQuery gets loaded only on page refresh in Rails 4 application

谢谢大家。

Answer 2

我在rails 5和Jquery Autocomplete方面遇到了同样的问题。我的导航栏中有我的搜索框，每次我在我的应用程序中访问不同的页面时，我的弹性搜索自动完成功能会中断，这并不会导致与我输入的内容相关的所有用户。为了解决这个问题，我将其添加到了_nav.html.erb <nav class="navbar navbar-fixed-top navbar-inverse" data-turbolinks="false">。我在搜索框周围尝试了我的div，但是，这似乎不起作用，但是在导航中工作。根据Turbolinks页面：使用Turbolinks，这些事件将仅在响应初始页面加载时触发 - 而不是在任何后续页面更改后＃34;。

刷新页面后自动完成功能无效？

2 个答案: