【问题标题】:jquery-datatables-rails bootstrap stylingjquery-datatables-rails 引导样式
【发布时间】:2013-04-09 09:06:01
【问题描述】:

在 rails 中,我通过 jquery-datatables-rails gem 使用 bootstrap 和 dataTables。但是,我似乎只获得了引导样式的一半。

gem 'jquery-datatables-rails', git: 'git://github.com/rweng/jquery-datatables-rails.git'

应用程序.js

    //= require jquery
    //= require jquery_ujs
    //= require jquery.ui.core
    //= require jquery.ui.datepicker
    //= require twitter/bootstrap
    //= require dataTables/jquery.dataTables
    //= require dataTables/jquery.dataTables.bootstrap
    //= require dataTables/extras/TableTools
    //= require chosen-jquery
    //= require best_in_place
    //= require cocoon
    //= require_tree .

    $.extend( $.fn.dataTableExt.oStdClasses, {
      "sWrapper": "dataTables_wrapper form-inline"
    } );

应用程序.css

 *= require_self
 *= require jquery.ui.core
 *= require jquery.ui.datepicker
 *= require dataTables/jquery.dataTables.bootstrap
 *= require dataTables/extras/TableTools
 *= require dataTables/extras/TableTools_JUI
 *= require chosen
 *= require_tree .
 */

具体的咖啡脚本

jQuery ->
  $('#customers').dataTable
    sDom: "<'row'<'span6'l><'span6'f>r>t<'row'<'span6'i><'span6'p>>"
    sPaginationType: "bootstrap"
    bjQueryUI: true

erb

<table id="customers" class="display" cellpadding="0" cellspacing="0" border="0" class="table table-bordered table-striped">  
  <thead>
    <tr>
      <th>etc.

但是样式是下面显示的,而不是 dataTable 站点 http://www.datatables.net/media/blog/bootstrap/ 上显示的样式

注意标题是错误的,条纹是紫色而不是灰色

对我还需要做什么有什么想法吗?

【问题讨论】:

  • 我也想做同样的事情,你用的是哪个版本的 gems 和 rails?
  • 我正在使用 rails 3.2.x 以及截至 2013 年 6 月的最新引导程序和数据表 gem。主要是删除对数据表 css 的所有引用

标签: ruby-on-rails twitter-bootstrap datatables


【解决方案1】:

这一切都归结为我对资产管道缺乏了解。一旦我明白了,更多的事情就会运作良好。

似乎我在开发中使用了预编译和压缩选项,因此 public/assets 目录中的 css 文件覆盖了我使用的任何其他文件。

一旦我删除了该目录的内容并将我的 capistrano 部署配置为在生产环境中进行预编译,一切正常。

资产管道当然很棒,但需要小心。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2016-06-29
    • 1970-01-01
    • 2018-03-05
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多