补充工具栏和主页面持久性 - Rails

时间:2015-08-24 20:27:19

标签: javascript jquery html ruby-on-rails navigation

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

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

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

1 个答案:

答案 0 :(得分:1)

您需要使用带有rails的AJAX。以下是它可能对你有用的方法:

  1. 添加:remote => 表格:' data-update-target' => ' update-container' 指定搜索结果的去向。您可能希望避免使用courses_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的部分&lt; - 这是您的结果。

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

  5. 在您的控制器中:

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

  6. 这将获得您想要的功能。请注意,这更像是一个 pesudocode ,而不是您想要做的事情的精确实现。你必须填补空白。

    我希望我能提供帮助!