javascript - 侧边栏和主页持久性 - Rails

Question

我正在使用侧边栏来搜索并生成列表(在侧边栏中)，我希望在使用侧边栏搜索时主页保持不变。我相信这需要一些JS，但我对JS一无所知。

• 我的导航栏位于 div _navbar.html.erb
• 主页基本上是正在生成的任何其他页面

这是我的代码:https://github.com/nrkfeller/ratingapplication

Answer 1

您需要将 AJAX 与 Rails 结合使用。以下是它对您的作用:

1. 在表单中添加 :remote => true 和 :'data-update-target' => 'update-container' 以指定您的位置想让搜索结果消失。您可能想避免使用 course_path，但使用 form_tag({:controller => courses, :action => 'search'}直接说明您希望将表单提交到的位置。

   <%= form_tag courses_path, method: :get, :remote => true ,class: "navbar- form navbar-right", :'data-update-target' => 'update-container' , role: "search" do %> <p> <%= text_field_tag :search, params[:search], class: "form-control" %> <%= submit_tag "Search",:disable_with => 'Please wait...', name: nil, class: "btn btn-default" %> </p> <% end %>

2. 将其添加到您的侧边栏。这是带有结果的部分内容:

     <div id="update-container"></div>
   

3. 添加 javascript`` 以将其放置在请求完成时应在的位置:

   <script> $(function() { $('form[data-update-target]').on('ajax:success', function(evt, data) { var target = $(this).data('update-target'); $('#' + target).html(data); }); });

4. 添加一个名为 _search_results.html.erb 的部分<- 这是您的结果所在。

   <!-- arbitrary code --> <%= @results.each do |result| %> <%= result %>

5. 在您的 Controller 中:

   def search @results= #your search code render :partial => 'search_results', :content_type => 'text/html' end

这将获得您想要的功能。请注意，这更像是一个伪代码，而不是您想要执行的操作的精确实现。你必须填补空白。

希望对您有帮助!