Question

我正在关注有关rails3 jquery autocomplete的https://github.com/crowdint/rails3-jquery-autocomplete-app教程。一切都很完美，除了自动完成！

以下是我使用的程序。

在gemfile中，我添加了“gem'trail3-jquery-autocomplete'”
我使用“rails g autocomplete：install”
我下载了Javascript文件
我在布局中包含了Javascript文件＆lt;％= javascript_include_tag'jquery-1.4.2.min.js'，'jquery-ui-1.8.4.custom.min.js'，'autocomplete-rails.js'，'rails.js'％＆gt; ＆lt;％= stylesheet_link_tag'jquery-ui-1.8.4.custom.css'％＆gt;
通过“rails g model Brand name：string”创建名称为字符串的品牌模型，并通过Brand.create（：name =＆gt;'Alpha'）将多个项目添加到Brand中。
创建了一个控制器“rails g controller welcome show”，并编辑了routes.rb 得到“欢迎/展示” root：to =＆gt; “欢迎＃秀”
在app / controllers / welcome_controller.rb中添加了“autocomplete：brand，：name”
在config / routes.rb
在app / views / welcome / show.html.erb中：＆lt;％= form_tag do％＆gt; ＆lt;％= autocomplete_field_tag'name'，''，welcome_autocomplete_brand_name_path％＆gt; ＆lt;％end％＆gt;

基本上我遵循了教程中的每一步，除了最后一步（我发现它应该是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-challenged（即我），代码是

%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 %>

没有教程中建议的：autocomplete =＆gt; 的IE，现在它正在为我工作。您的示例代码显示您已经拥有此代码，因此您可能会遇到以下我也更改过的问题：

在我专注于前面几点之前，我的控制台日志发出了各种关于找不到.css和.js文件的抱怨。我最终将所有文件从 public / javascripts 和 public / stylesheets 转移到新的 app / assets / javascripts 和 app / assets / stylesheets ，然后修改主 application.js 和 application.css 文件的内容，以及主要布局：

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

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

应用程序/资产/ Javascript角/ 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宝石一起使用！希望不再需要一天的生命。

干杯

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合并到您在app / assets / stylesheets中找到的默认值。

Answer 2

我有类似的经历，在OSX上使用Rails 3.2.8，在Windows上使用3.2.9，并在此处遵循自动完成应用程序的教程：

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

如果我从github下载了示例应用程序，它编译并正常工作。如果我按照步骤操作，我就无法开始工作了。示例应用程序中有很多其他东西，所以我想用最简洁的方式与之交互。在挖掘之后，我发现除了遵循使工作正常的步骤之外，还需要进行以下更改。

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

<%= javascript_include_tag :defaults %>

来自application.html.erb文件的

行。它不在那里，在加载过程中会导致错误。

rails版本为3.2.9或3.2.8，请确保您明确地将其调出。

gem 'rails', '3.2.9'

确保您明确将rails3-jquery-autocomplete版本化为版本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文件head部分与我从jqueryui.com下载的最新jquery文件看起来像这样

  <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位Windows上没有加载sqlite3。解决方案是将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。它们不相同，虽然输入字段的呈现方式相同，但使用错误的标记时自动完成功能不起作用。

Rails3中，jQuery的自动完成

2 个答案: