0

我有一个使用 pg_search gem 的搜索表单。我基本上是从 Railscast #343 改编而来的。

但是，无论我尝试什么，它总是会在搜索时重新加载页面。

我尝试在表单中添加 :remote => true 并使用 format.js 在控制器中放入一个 respond_to 块。我还尝试在仅返回 js 但我的页面始终使用 url 中的参数重新加载的路由中创建单独的“/search”路径。

这是相关的代码位：

形式：

  <div id="search_controls">
    <form class="form-inline">
      <div class="form-group">
        <%= form_tag discover_path, :method => 'get', id: "tapes_search" do %>
          <%= text_field_tag :query, params[:query], :autocomplete => :off, id: 'search_field', class: "form-control" %>
          <%= submit_tag "Search", :name => nil, id: 'search_submit', class: 'btn btn-default' %>
        <% end %>
      </div>
    </form>
  </div>
</div>

控制器：

def index
  if params[:query]
    @tapes = Tape.search(params[:query]).order("release_date DESC", :id).paginate(:page => params[:page], :per_page => 15)
  else
    @tapes = Tape.order("release_date DESC", :id).paginate(:page => params[:page], :per_page => 15)
  end
end

模态：

include PgSearch
pg_search_scope :search, against: [:album_name, :artist_name], 
    using: {tsearch: {dictionary: "english"}},
    ignoring: :accents

def self.text_search(query)
    search(query)
end

路线

match '/discover', to: 'tapes#index', via: 'get'

这显然是因为它没有任何 ajax 功能。有人介意向我展示我必须做什么才能谨慎地提交参数，而无需重新加载页面并触发 js 作为响应吗？

我在整个网站上都使用了 ajax，不知道是什么阻碍了我:( 谢谢！

4

2 回答 2

0

我最近遇到了类似的问题，不得不从头开始编写 AJAX API 调用，而不是使用 remote => true：

jQuery(function() {
  $('form').submit(function(e) {
    var getData = $(this).serialize(); //grabs data from form input
    var formURL = $(this).attr('action'); 
    $.ajax({
      url: formURL,
      type: 'GET',
      data: getData,
      success: function(data, textStatus, jqXHR){
        $('search_controls').append(data); //this is the JS that gets triggered in response to a successful return. Data is what was returned.
      },
      error: function(jqXHR, textStatus, errorThrown){}
    });
    e.preventDefault();
  });
});

$(document).submit();
于 2015-02-13T00:34:36.867 回答
0

:remote => true 选项在这里对您没有帮助，实际上它根本不是很有用，但这将是一个单独的主题。

通常，您可以通过以下方式处理此问题：

  1. https://github.com/waymondo/turboboost -> rails 中非常简单的 ajax 表单
  2. 在 jquery 中使用 ajax 方法。示例：http ://api.jquery.com/jquery.post/
  3. 如果您正在构建更大的东西，请使用一些 js 框架，例如 Ember 或 Angular。
于 2015-02-12T21:14:22.343 回答