Rails3中，jQuery的自动完成

Question

我这里https://github.com/crowdint/rails3-jquery-autocomplete-app是约Rails3中的jQuery自动完成以下教程。除了自动完成之外，一切都完美无缺！

下面是我所使用的方法。

1. 在Gemfile中，我添加了“宝石‘Rails3中，jQuery的自动完成’”
2. 我使用“轨道摹自动完成：安装”生成自动完成文件
3. 我下载JavaScript文件
4. 我包含的JavaScript通过 <％= javascript_include_tag '的jquery-1.4.2.min.js'， '的jquery-UI-1.8.4.custom.min.js'， '自动完成-rails.js'，“rails.js在布局文件“％> <％= stylesheet_link_tag '的jquery-UI-1.8.4.custom.css' ％>
5. 通过“rails g model品牌名称：字符串”创建了一个名称为字符串的品牌模型，并通过Brand.create（：name =>'Alpha'）向品牌中添加了多个项目。
6. 创建控制器“轨摹控制器迎宾表演”，并通过 编辑routes.rb中得到“欢迎/秀” 根：到=>“欢迎＃秀”
7. 增加了“自动完成：品牌：名”在app /控制器/ welcome_controller.rb
8. 添加 “得到 '欢迎/ autocomplete_brand_name'” 中的config/routes.rb中
9. 在应用程序/视图/首页/ show.html.erb： <％=的form_tag DO％> <％= autocomplete_field_tag '姓名'， ''，welcome_autocomplete_brand_name_path％> <％端％>

基本上我遵循教程中除最后一步之外的每一步（我发现它应该是autocomplete_field_tag而不是text_field_tag的名称）。但是，自动填充不起作用。我是Rails的新手，为此奋斗了好几天。任何人都可以对这个问题有所了解？

谢谢！

Answer 1

我一直患有完全相同的问题（Rails的3.2.1和使用演示应用教程）。我也有更多关于发生了什么的信息，这导致我找到了解决方案。希望对你有帮助！

我的控制台日志中显示以下错误：

Started GET "/%7B:autocomplete=%3E%22/welcome/autocomplete_brand_name%22%7D?term=Al" for 127.0.0.1 at 2012-09-04 21:38:14 +1000 
ActionController::RoutingError (No route matches [GET] "/%7B:autocomplete=%3E%22/welcome/autocomplete_brand_name%22%7D"): 

对于ASCII-挑战（即我）的代码是

%7B { 
%3E > 
%22 " 
%7D } 

所以URI它试图得到的是

/{:autocomplete=>"/welcome/autocomplete_brand_name"}?term=Al 

哪位路由器不高兴。

当你在为渲染网页的HTML源代码，它看起来像：

<input data-autocomplete="{:autocomplete=&gt;&quot;/welcome/autocomplete_brand_name&quot;}" id="name" name="name" type="text" value="" /> 

这表明从.erb文件中的参数被泄露过。我修改表单的内容有：

<%= form_tag do %> 
    <%= autocomplete_field_tag 'name', '', welcome_autocomplete_brand_name_path %> 
<% end %> 

即没有：自动完成=>在本教程中建议，现在它为我工作。你的示例代码显示你已经有了这个，所以你可能会遇到以下我也改变了的问题：

在我设法专注于前面几点之前，我的控制台日志发出各种抱怨，没有找到.css和.js文件。我已经结束了从公共/ JavaScript的和公共/样式移的所有文件到新的应用程序/资产/ JavaScript的和应用程序/资产/样式，然后修改主应用程序的内容.js文件和application.css文件，也主要布局：

应用程序/资产/样式表/ application.css：

*= require_self 
*= require jquery-ui-1.8.23.custom 
*= require_tree . 

应用程序/资产/ Java脚本/ application.js中：

//= require jquery-1.8.0.min 
//= require jquery-ui-1.8.23.custom.min 
//= require autocomplete-rails 
//= require rails 
//= require_tree . 

如果您的.js和.css的确切版本号不同，不要忘了在我的例子来更改数字。

最后的变化是删除建议添加到application.html.erb并依赖资产管道（即所有上述要求）。唯一的项目我有.css和主布局.js文件被

应用程序/视图/布局/ application.html.erb：

<%= stylesheet_link_tag 'application' %> 
<%= javascript_include_tag 'application' %> 

现在我已经得到了工作的基本知识，我可以回头尝试将它与HAML，Formtastic和nested_forms gem一起使用！希望这不会再耗费我一天的时间。

干杯

PS - 教程还表示把

gem 'rails', '3.0.0' 

但因为你是使用Rails 3.2.1，把它作为原：

gem 'rails', '3.2.1' 

最后，漂亮的脚手架发电机并不完全符合3.2.1标准的要求;将它的文件从public/javascripts和public/stylesheets转移到app/assets子目录中。你必须编辑和合并漂亮的.css到默认的应用/资产/样式表中。

Answer 2

我有类似的经历，使用Rails 3.2.8在OSX和3.2.9的Windows，并按照自动完成应用这里的教程：

https://github.com/crowdint/rails3-jquery-autocomplete-app

如果我从GitHub，它下载的示例应用程序编译和工作正常。如果我遵循了这些步骤，我无法让事情顺利进行。示例应用程序中有一堆其他东西，所以我希望最简单的方式与此交互。挖掘之后，我发现除了遵循让事情正常工作的步骤外，还需要进行以下更改。

• 教程要求您将jquery和其他js文件复制到public/javascript中。别。将它们复制到app/assets/javascript和app/assets/stylesheets下。 Rails的这个版本在那里寻找它们，否则你将会失败。

• 从您的application.html.erb文件

<%= javascript_include_tag :defaults %>

线。它不存在并且会在加载过程中导致错误。

• rails版本是3.2.9或3.2.8，请确保你明确地调用它。

gem 'rails', '3.2.9' 

• 确保您明确版本的Rails3中，jQuery的自动完成功能，如下0.6.0版本。

source 'https://rubygems.org' 

gem 'rails', '3.2.9' 

# Bundle edge Rails instead: 
# gem 'rails', :git => 'git://github.com/rails/rails.git' 

gem 'sqlite3' 
gem 'rails3-jquery-autocomplete', '0.6.0' 
gem 'nifty-generators' 

# Gems used only for assets and not required 
# in production environments by default. 
group :assets do 
    gem 'sass-rails', '~> 3.2.3' 
    gem 'coffee-rails', '~> 3.2.1' 

    # See https://github.com/sstephenson/execjs#readme for more supported runtimes 
    # gem 'therubyracer', :platforms => :ruby 

    gem 'uglifier', '>= 1.0.3' 
end 

gem 'jquery-rails' 

我没有改变的application.js文件在所有。

// 
//= require jquery 
//= require jquery-ui 
//= require jquery_ujs 
//= require_tree . 
// 

application.html.erb文件头部分看起来是这个最新的jQuery的文件，我从jqueryui.com

<head> 
    <title><%= content_for?(:title) ? yield(:title) : "Untitled" %></title> 
    <%= stylesheet_link_tag "application" %> 

<%= javascript_include_tag 'jquery-1.8.2.js', 'jquery-ui-1.9.1.custom.min.js', 'autocomplete-rails.js', 'rails.js' %> 
<%= stylesheet_link_tag 'jquery-ui-1.9.1.custom.css' %> 
    <%= csrf_meta_tag %> 
    <%= yield(:head) %> 
    </head> 

下载我跑进也小的事情是不是装上64的sqlite3位Windows。 解决方案是将sqlite3.dll复制到windows/system目录中。不是windows或windows/system32，或者路径上的任何地方，而不是ruby/bin。

最后，在早期版本的rails3-jquery-autocomplete中，支持text_field_tag。 github上的示例使用0.6.0作为此gem的版本，并使用text_field_tag。对于像1.0.10这样的更新版本，支持autocomplete_field_tag。它们并不相同，虽然输入字段的显示方式相同，但使用错误标记时，自动完成功能将不起作用。