0

我正在尝试在 ruby​​ on rails 项目中使用 FooTable（我以前从未使用过 FooTable），但我无法使其工作。

我已经插入gem 'footable-on-rails'了我的 gemfile（并运行了 bundle install）

我已经插入footable.js和插入app/vendor/assets/javascript（app/assets/javascript哪个是最好/正确的位置？）

我已经插入并且也插入footable.core.css了 app/vendor/assets/stylesheetapp/assets/stylesheet

我创建了这个文件，名为footable_init.js

$(document).ready(function() 
{
    $("table").footable();
});

我还将application.js文件更改为：

    //= require turbolinks
    //= require bootstrap.min
    //= require footable-on-rails
    //= require jquery
    //= require jquery-ui
    //= require jquery_ujs

//= require_tree .

和我的application.css 

 *= require bootstrap.min
 *= require footable-on-rails
 *= require_tree .
 *= require_self
 */

注意我也在使用引导程序。

最后我的观点是这样的：

<!DOCTYPE html>
<html lang="en">
    <head>
        <title>App</title>
        <meta charset="UTF-8" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
        <meta name="viewport" content="width=device-width, initial-scale=1.0"> 

        <%= stylesheet_link_tag 'footable.core.css' %>
  <%= javascript_include_tag 'footable.js', 'data-turbolinks-track' => true %>
  <%= javascript_include_tag 'footable_init.js', 'data-turbolinks-track' => true %>
  <%= javascript_include_tag 'jquery.js', 'data-turbolinks-track' => true %>

    </head>
    <body>
        <table class="table">
        <thead>
                <tr>
                        <th>Name</th>
                        <th data-hide="tablet,phone">Age</th>
                </tr>
         </thead>
        <tbody>
            <tr>
                <td>Luke</td>
                <td>45</td>
            </tr>
            <tr>
                <td>Amy</td>
                <td>28</td>
            </tr>
            <tr>
                <td>Carl</td>
                <td>25</td>
            </tr>
        </tbody>
        </table>
    </body>     
</html>

但是当我通过手机或平板电脑分辨率时，我看到了这两列。我错过了什么？

我认为将 FooTable 包含在我的 rails 项目中会很容易，但这花了我太多时间。预先感谢。

4

1 回答 1

0

您添加footable.js了三次而不是一次。通过添加require 'footable-on-rails'您的 application.js，gem 已经包含了 JavaScript。您的 CSS 文件也是如此。

无需将它们都添加到app或vendor目录中。删除这些文件，看看是否有帮助。

此外，您必须包含您的应用程序文件。根据资产管道文档添加

<%= stylesheet_link_tag "application", media: "all" %>
<%= javascript_include_tag "application" %>

到您的应用程序布局。

于 2015-09-17T08:43:01.010 回答