jQuery Datepicker 不适用于 Heroku/Rails 3.1

Question

大家好，

我对 jQuery Datepicker 和 Rails 3.1 感到非常沮丧。 它在我的开发环境中完美运行，但在 Heroku/Cedar 的生产环境中无法运行。当我选择我的日期字段时，它根本不会弹出。

这就是我到目前为止所做的：
我将 jquery 文件放入 \apps\assets\javascript:

• jquery-1.7.1.min.js
• jquery-ui-1.8.17.custom.min.js
• jquery.ui.datepicker-de.js

我将它们与其他文件一起添加到我的 production.rb：

# Precompile additional assets (application.js, application.css, and all non-JS/CSS are already added) <br />
config.assets.precompile += %w( event_calendar.js event_calendar.css jquery-1.7.1.min.js jquery-ui-1.8.17.custom.min.js jquery-ui-1.8.17.custom.css jquery.ui.datepicker-de.js)

然后我在本地 as described here 预编译了我的资产，它们正确地出现在 /public/assets/ 和我的 ma​​nifest.yml 中。所以一切看起来都很好，在将我的应用程序推送到 Heroku 时我没有收到任何错误，但是当我选择与 datepicker 关联的文本字段时，没有任何反应，它根本不会显示。

您有什么想法吗？
我怎样才能找出问题所在？

在 Heroku 日志中，我只能找到这样的条目：

cache: [GET /assets/application-58ec8ec4b5384a8fb8d7884169385e49.css] miss

如果有人可以提供帮助，我会很高兴。

---

更新：

这是我的application.js：

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

$(document).ready(
  function()
  {
    $("#picker").datepicker($.datepicker.regional['de']);
    $("#picker").datepicker();
  }
);

据我所知，//= require_tree . 负责将所有 javascript 文件包含在 assets 文件夹中，例如 \app\assets\javascripts\。这是否包括\public\assets 中的预编译资产？

这是我的application.css：

/*
 * This is a manifest file that'll automatically include all the stylesheets available in this directory
 * and any sub-directories. You're free to add application-wide styles to this file and they'll appear at
 * the top of the compiled file, but it's generally better to create a new file per style scope.
 *= require_self
 *= require_tree . 
*/
...

同样，我认为*= require_tree . 负责\app\assets\stylesheets 以及\public\assets，我的预编译样式表所在的位置。

这里是heroku上应用的链接，选择日期字段应该会弹出日历：
http://smooth-window-1858.herokuapp.com/events/new

Answer 1

与此同时，我发现了我的项目出了什么问题。
我不得不在\config\environments\production.rb 中禁用 Rails 的静态资产服务器：

config.serve_static_assets = true

此外，我必须在我的 Gemfile 中添加 jquery-rails：

gem 'jquery-rails'

现在 datepicker 工作正常，我从 /app/assets/javascript 中删除了 jquery .js 文件，因为 gem 会处理这些。但是，我认为在资产预编译过程中添加了jquery文件。他们来自哪里？

当我在我的布局中简单地引用 Google CDN 时，资产预编译（Heroku 需要）如何工作，例如：

  <%= stylesheet_link_tag "http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/redmond/jquery-ui.css", "application" %>
  <%= javascript_include_tag "http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js", "http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js", "application" %>

Answer 2

我猜你缺少 css 文件，而不是 js 文件。检查错误。确保样式表文件夹中存在jquery-ui-1.8.17.custom.css，并且样式表文件夹中应该有一个日期选择器样式表，以便日期选择器显示出来。

如果错误仍然存​​在，请在此处粘贴您的 application.js 文件和 application.css 文件。

Answer 3

它们可能不显示的原因是您没有在视图中正确引用它们。

将文件添加到预编译确实可以确保在帮助方法中存在可用于直接引用的文件副本，但它不会将这些文件包含在视图中。

如果您确实在视图中引用了它们，则需要使用 Rails 辅助方法，而不是硬链接到它们。 Rails 的助手处理插入正确的生产文件名。

正常方式（最佳实践）是在 application.js 和 application.css 清单中要求这些文件。

您不应在生产日志中看到缓存未命中/命中条目。这表明您的应用程序没有使用预编译文件，而是将请求传递给 Sprocket。

这有两个可能的原因：一是您硬链接到文件（即未使用辅助方法），二是管道配置不正确。

对照last section of the asset pipeline guide 中的设置检查您的配置设置。

回复更新和评论：

require_tree 将 javascript 和 stylsheets 文件夹中的文件导入主清单。

对于您的 JS，您的 application.js 中将按此顺序包含所有这些必需的文件。这些必需的文件都不存在于 public/assets 中，因为它们被滚动到清单中并且不必单独预编译（它们可以从预编译数组中删除）。

您只需要具体说明文件的顺序在哪里很重要 - 例如 jquery 和 jquery ujs 应该按照您拥有它们的顺序排在第一位。