ruby-on-rails-4 - 为什么 jquery-tablesorter 在我的 Rails 4 应用程序中不起作用？

Question

我正在尝试将 jquery-tablesorter 功能添加到一个新的应用程序中Michael Hartl 的 Rails 教程示例应用程序，使用 Ruby 2.1.0p0 和 Rails 4.0.2在 Mac (OSX Mavericks) 上，我确定我做错了什么，因为 demo code在我的浏览器中工作。

正在关注 these instructions ,我在我的 Gemfile 中添加了以下行:

gem 'jquery-tablesorter'

跑了

'bundle install'

这是 a Gist我的 Gemfile.lock 的新内容。

我将其添加到我的 application.js 文件中:

//= require jquery-tablesorter

这是我的 application.css 文件:

*= require jquery-tablesorter/theme.blue

将这些文件复制到我的 app/assets/javascripts 文件夹中(尽管我相信我只需要“jquery.tablesorter.js”):

jquery.metadata.js
jquery.tablesorter.js
jquery.tablesorter.widgets.js

接着是these instructions ，通过使我的表具有“myTable”的 id 和“tablesorter”类并将此代码放入我的“studios.js”文件中:

$(function(){
    $("#myTable").tablesorter();
});

但是当我查看 studios/index 时，我没有看到可排序的标题，也没有蓝色主题的样式。全部根据我的开发日志，javascript 和 css 文件加载成功。

这是 a Gist of the page source .

Rails 教程代码包含一个 microposts.js 文件，用于显示运行计数新微博中剩余的可用字符:

function updateCountdown() {
        // 140 is the max message length
        var remainder = 140 - jQuery('#micropost_content').val().length;
        jQuery('.countdown').text(remainder + ' characters remaining');
}

jQuery(document).ready(function($) {
        updateCountdown();
        $('#micropost_content').change(updateCountdown);
        $('#micropost_content').keyup(updateCountdown);
});

我想，因为这个 javascript 使用 'jQuery(document).ready(function($)' 而不是'$(document).ready(function()),' 如入门说明中所示Tablesorter，并且由于 microposts.js 代码运行正常，我应该尝试将 studios.js 更改为:

jQuery(document).ready(function($){
    $("#myTable").tablesorter();
});

但是，遗憾的是，我仍然没有获得可排序的标题或蓝色主题的样式。

说明位于 https://github.com/themilkman/jquery-tablesorter-rails别提是否需要添加图片资源，是否需要添加CSS文件存储/编辑。通过仔细阅读页面源代码中加载的 theme.blue.css 文件，我可以看到箭头图片已编码，所以我认为我的 app/assets/images 文件夹中不需要它们。
因为我可以在查看页面时通过单击链接来查看 theme.blue.css 文件source，我假设蓝色主题的样式也正在加载。

我想我已经准备好让 tablesorter 发挥作用的所有部分，我只是想不通为什么我的表的元素都没有用 tablesorter 类更新，因此没有任何排序功能和样式应用。

Answer 1

我为您创建了一个演示，介绍如何将 tablesorter gem 添加到普通 Rails 项目(尤其是添加重要内容的第二次提交):https://github.com/themilkman/tablesorter-demo关于您的问题: 1. 您不应复制任何默认的 JS/CSS 文件，这些文件来自 gem 并自动进入 rails Assets 管道。2. 这听起来确实像是 turbo-links 的麻烦。我在上面的示例中针对此添加了一个 gem。希望这对您有所帮助!