Rails-自动完成输入,并实时更新可滚动文本框

时间:2019-05-07 13:48:26

标签: ruby-on-rails elasticsearch autocomplete typeahead searchkick

我正在尝试通过自动完成控制器方法实时更新Rails的HTML页面上的可滚动文本框字段,并得到重复的渲染错误。

我在Rails项目中将“ typeahead” gem与seachkick和elasticsearch一起使用,并且具有HTML页面设置,用户可以在其中输入文本字段中的信息。在控制器中,我定义了一种自动完成方法,每次用户在文本字段中键入字符时都会调用该方法。在此HTML页面上,我还想在文本框下方放置一个可滚动的文本框。这个可滚动的文本框将显示基于用户键入的单词的搜索结果。用户可以滚动列表并选择满足其搜索条件的记录。我使用自动完成方法(每次用户在文本字段中键入一个字符时都会调用该方法)也根据用户迄今为止输入的单词或字符从数据库中获取信息。

我知道预先输入的宝石(带有searchkick)也可以显示结果,但是我正在使用它来显示用户键入的每个单词的提示,而不是从此文本字段中输入的多个单词中搜索结果。因此,我正在使用自动完成方法来捕获用户输入。在自动完成方法中,我调用了另一个方法来搜索数据库并基于此文本字段中的字符快照返回大量记录。

以上所有方法都可以正常工作。我的问题是我不确定如何仅使用数据库搜索结果来更新此HTML页面上的可滚动文本框。如果我尝试从自动完成控制器方法(部分仅是可滚动的文本框)内渲染部分,则轨道会给我一个重复的渲染错误。如何在此可滚动文本框中实时更新数据库搜索结果?

相关的HTML代码: _search_partial.html.erb *请注意,此div(现在)是为了查看是否可以从控制器渲染它。一旦成功,实际的代码将被插入。

<div class="search_results">
  <select size="20">
      <option value="1">Item #1</option>
      <option value="2">Item #2</option>
      <option value="3">Item #3</option>
      <option value="4">Item #4</option>
      <option value="5">Item #5</option>
      <option value="6">Item #6</option>
      <option value="7">Item #7</option>
  </select>
</div>

 <%= form_tag catalog_book_search_results_path, method: :get do %>
      <div class='form-group'>
        <%= text_field_tag :query, params[:query], size: 75, class: 'form-control typeahead', id: "contribs_search", placeholder: "Author-Contributor-Title" %>
        <%= submit_tag 'Add' %>
      </div>
    <% end %>
  </div>

*注意:上面的代码片段显示了'Typeahead / Autocomplete'使用的字段,并在下面调用了autocomplete控制器方法。请查看添加到自动完成方法中的注释。

def autocomplete
   if params[:query].present?
     # @book_list contains the results of the db search based on chars typed in by the user thus far.
     @book_list = ContributorBook.select_book_list(params[:query].to_s)
# It is here that I would like to eventually render the above 
# _search_partial.html.erb with results in @book_list.
# I know how to populate results but don't know how to
# render that partial as I receive a 'duplicate render' error
# message.
   end
   render json: TokenFrequency.search(str2).map do |tokens|
          { name: tokens.token, value: tokens.token}
end

如前所述,应该使用用户键入的每个字符来更新可滚动文本框,但是我不确定如何在自动完成控制器方法中完成该操作。

0 个答案:

没有答案