Javascript &引用；建议；rails应用程序中文本框的功能

我正在寻找一种最简单的方法，如何在Rails应用程序中为文本输入字段实现“建议”功能。其思想是完成数据库列中存储的名称，在用户键入时为其提供可能匹配的下拉菜单

---

谢谢你的建议

RubyonRails提供了。此框架由使用，它提供了一个可能提供您所寻求的功能的框架。

编辑：我将把此答案作为一种理论参考点，但听起来可能对您更有用：）

免责声明：尽管我为谷歌工作（谷歌在各种UI中都有“建议”元素），但我没有看过这方面的任何代码，甚至没有与任何人谈论过客户端方面的问题

服务器端语言可能与此无关。重要的一点是客户端所需的AJAX

我建议你有一个大约1秒的计时器（尝试寻找一个最佳点），每当用户在文本框中输入一个按键时，计时器就会重置，如果用户离开文本框，计时器就会被取消。如果计时器触发，则使其触发AJAX请求。AJAX请求将包含用户迄今为止键入的内容。AJAX响应应该是建议列表和原始请求文本

如果在AJAX响应返回时，文本框中的文本仍然与响应中的字段相同（即用户此后没有键入），并且文本框仍然具有焦点，则提供下拉列表。（必须有数百个关于HTML组合框的示例页面才能完成这方面的工作。）

服务器需要做的就是通过执行搜索和适当地格式化响应来响应AJAX请求——这比客户端容易得多

---

希望这能有所帮助-很抱歉没有任何示例代码，但我怀疑这涉及到很多问题，而且我不是一名真正的JavaScript开发人员。

与Rails中的大多数内容一样，有几种方法可以做到这一点。Rails以前内置了一组自动完成帮助程序，但现在该功能已被删除到自动完成插件中。这可能是实现您想要实现的最简单的方法—控制器中的一个简单命令，视图中的一些简单内容—ta dah。要使用此解决方案，您只需将插件安装到您的应用程序中即可-请参阅，这将告诉您安装插件和入门所需的全部知识

---

正如在另一个答案中所指出的，走这条路线将使用与Rails捆绑在一起的原型和脚本式AJAX框架。还有其他AJAX框架，特别是JQuery，也可以帮助您完成这一功能，但是您将有更多的学习来使用它们，而不仅仅是使用插件。

您也可以尝试这种稍微手动的方法

# your_view.rhtml

<%= text_field 'contact', 'name', :id => 'suggest' %>
<div id='dropdown' style='display:none; z-index: 100; background: #FFFFFF'></div>

<script>
  new Ajax.Autocompleter('suggest', 'dropdown', "<%= url_for :controller => 'contacts', :action => 'suggest_name' %>") 
</script>

# contacts_controller.rb

def suggest_name
  query_string = params[:contact][:name]
  @contacts = Contact.find.all :conditions => ['name ilike ?', "%#{query_string}%"]
  render :partial => 'name_suggestions'
end

# contacts/_name_suggestions.rhtml

<ul>
<% for contact in @contacts %>
  <li><%= contact.name %></li>
<% end %>
</ul>

#your_view.rhtml
'建议'>
新的Ajax.Autocompleter（'suggest'，'dropdown'，'contacts'，：action=>'suggest_name'>'））
#联系人\u controller.rb
你的名字
query_string=params[：contact][：name]
@contacts=Contact.find.all:conditions=>['name ilike'，“%#{query_string}%”
render:partial=>“名称建议”
结束
#联系人/_name_suggestions.rhtml

Rails使用

text\u field\u with\u auto\u complete

方法使文本字段的“建议”式自动完成变得非常简单

在Rails1.x中，这个方法是内置的，但是对于Rails2.x，它被移动到了

假设您有一个名为

Post

的模型，它有一个名为

title

的文本字段。在您看来，如果您通常使用

text\u field\u标记

（或

f.text\u field

），只需将

text\u field\u与自动完成

一起使用即可：

<%= text_field_with_auto_complete :post, :title %>

这在幕后的作用是为控制器动态添加一个名为“

auto\u complete”的动作，该动作用于对象方法。在上面的示例中，此操作将被称为
auto\u complete\u，用于\u post\u title

值得指出的是，此自动生成操作使用的
find
调用将跨所有模型对象执行，例如
Post.find（：all，…）
。如果这不是您想要的行为（例如，如果希望根据登录的用户将搜索限制为
Post
s的特定子集），那么您必须在控制器中定义自己的
auto\u complete\u来执行[object]\u[method]
操作

class PostsController < ApplicationController
  auto_complete_for :post, :title
end