У меня очень странная проблема. Вчера я добавил опцию автозаполнения в мою форму в приложении Rails (Algolia Places). Я также установил webpacker для работы с пакетами внутри моего приложения. Итак, получается, что в моем адресе. html .erb я теперь получаю две формы, отображаемые друг под другом: одну с автозаполнением и другую без. См. Изображение ниже (первая форма имеет адрес автозаполнения, а нижняя - нет).
Я предполагаю, что проблема в моем приложении. html .erb, где код на данный момент выглядит следующим образом:
<!DOCTYPE html>
<html>
<head>
<title>Neigbornow</title>
<%= csrf_meta_tags %>
<%= csp_meta_tag %>
<meta>
<%= yield %>
<%= javascript_include_tag 'application' %>
<%= javascript_pack_tag 'application' %>
<%= javascript_pack_tag 'autocomplete' %>
</meta>
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
</head>
<body>
<% if @user.nil? %>
<%= render 'layouts/header' %>
<% elsif user_signed_in? && current_page?(user_step_path) || %>
<%= render partial: "layouts/header_address" %>
<% else %>
<%= render 'layouts/header_rest' %>
<% end %>
<%= render 'layouts/flash' %>
<%= yield %>
</body>
</html>
Консоль выдает следующую ошибку:
You are loading Turbolinks from a <script> element inside the <body> element. This is probably not what you meant to do!
Load your application’s JavaScript bundle inside the <head> element instead. <script> elements in <body> are evaluated with each page change.
For more information, see: https://github.com/turbolinks/turbolinks#working-with-script-elements
——
Suppress this warning by adding a `data-turbolinks-suppress-warning` attribute to: <script src="/assets/turbolinks.self-569ee74eaa15c1e2019317ff770b8769b1ec033a0f572a485f64c82ddc8f989e.js?body=1"></script>
Если я изменяю
<%= yield %>
на
<%= yield :js %>
Вторая форма исчезает, но функция автозаполнения также исчезает. То же самое произойдет, если я перейду
<%= yield %>
до конца. Это довольно загадка для меня. Мне действительно нужна помощь по этому вопросу, так как для inte на этом нет никаких файлов rnet.
PS Вот макеты / заголовок
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<div class="navbar-brand pull-left" href="#">
<img src="<%= image_path('logo_transparent.png') %>" width="147" height="70" class="d-inline-block align-left mr-2">
</div>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav pull-right">
<li><%= link_to 'Home', root_path, method: :get %></li>
<li><a>About</a></li>
<li><a>Search</a></li>
<li><a>Contact</a>
<% if user_signed_in? %>
<% if current_user.profile == nil %>
<li><span class="bg-primary text-white rounded"><%= link_to 'Create profile', new_user_profile_path(current_user.id) %></span></li>
<% else %>
<li><span class="bg-primary text-white rounded"><%= link_to 'My profile', user_profile_path(@user) %></span></li>
<% end %>
<li><span class="bg-primary text-white rounded"><%= link_to 'Log out', destroy_user_session_path, method: :delete %></span></li>
<% else %>
<li><div class="log-in-btn"><button class="btn" type="submit"><%= link_to 'Log in', new_user_session_path %></button></div></li>
<% end %>
</ul>
</div> <!--/.nav-collapse -->
</div>
Но я фактически рендеринг другого заголовка на эта страница - пустая, как вы можете видеть
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<div class="navbar-brand pull-left" href="#">
<img src="<%= image_path('logo_transparent.png') %>" width="147" height="70" class="d-inline-block align-left mr-2">
</div>
</div>
</div>
</nav>
На первой странице, без функции автозаполнения, эта проблема не появляется.
PS - отредактированная версия
<!DOCTYPE html>
<html>
<head>
<title>Neigbornow</title>
<%= csrf_meta_tags %>
<%= csp_meta_tag %>
<%= yield :meta %>
<%= yield %>
<%= javascript_include_tag 'application' %>
<%= javascript_pack_tag 'application' %>
<%= javascript_pack_tag 'autocomplete' %>
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= yield :css %>
</head>
<body>
<% if @user.nil? %>
<%= render 'layouts/header' %>
<% elsif user_signed_in? && current_page?(user_step_path) || %>
<%= render partial: "layouts/header_address" %>
<% else %>
<%= render 'layouts/header_rest' %>
<% end %>
<%= render 'layouts/flash' %>
<!- I would really recommend that you wrap this in an element -!>
<div id="main">
</div>
</body>
</html>