DataTables没有在Rails中显示引导糖果子

Question

由于我放弃在Rails 4项目中使用Rails-assets或Bower添加DataTables 1.10.8，所以我直接在/vendor/assets/DataTables目录中添加了组件，并在application.js中进行了编辑：

//= require jquery
//= require jquery_ujs
//= require bootstrap
//= require select2
//= require datatables  // This
//= require turbolinks
//= require_tree .

和application.css.scss

*= require_self
 *= require select2
 *= require datatables  // This
 *= require_tree .
 */

为了测试DataTables，我只需输入一个表单，并使用console，我将引导类设置为一个表，并将其转换为DataTable，如下所示：

$('table').DataTable( {
    dom: 'B<"clear">lfrtip',
    buttons: {
        name: 'primary',
        buttons: [ 'copy', 'csv', 'excel' ]
    }
} );

很明显，它起作用了，但是缺少了一些东西，排序头中的那些小图标。

​

​

注意:我包括了来自DataTables网站的自定义下载。

更新:很显然，我对图标有问题，有些字体丢失了什么的。我目前正在使用gem 'bootstrap-sass', '~> 3.3.5'

Answer 1

• 你把图像拷贝到资产文件夹了吗？您需要复制"vendor/assets/images/dataTables/{sort_asc.png|sort_both.png|sort_desc.png“文件
• 您应该尝试避免将dataTable添加到所有表$('table')中，这样做可以将其绑定到类(".dt")或id ("#dt")
• 正确的API是$('table').dataTable({}).。注意这个小箱子。" DataTable "返回api对象，而不是DataTable对象。但很明显，它仍然有效！

确保application.js文件

//= require dataTables/bootstrap/{3 OR 2}/jquery.dataTables.bootstrap

这些文件也应该放在供应商/资产文件夹中。

顺便问一下，你试过使用jquery-数据表-rails宝石吗？

将以下内容添加到Gemfile中

gem 'jquery-datatables-rails', '~> 3.3.0'

在项目文件夹中运行以下命令

rails generate jquery:datatables:install bootstrap2

或者如果你喜欢bootstrap3

确保在application.js和css文件中添加额外的内容。

//= require dataTables/extras/dataTables.tableTools 

应该存在于您的application.js文件中，类似地，您的application.css应该具有以下内容：

 *= require dataTables/extras/dataTables.tableTools 

Answer 2

解决此问题的唯一方法是下载引导包并将字体复制到供应商目录中的字体文件夹中，并在此答案中添加以下内容：

https://stackoverflow.com/a/20297523/598070

Answer 3

我只需将图像复制到app/assets/images，并为这些特定的图像文件创建一个解决方案，如下所示：

 get '/assets/plugins/datatables/images/:name.:ext', to: redirect('/assets/%{name}.%{ext}'), constraints: { name: /.+/, ext: /(jpg|png|gif)/ }

适用于jquery-datatables-rails (3.4.0)和rails 5.0.0。