Railcasts 340 - 数据表(不适合我)

时间:2014-10-26 19:39:26

标签: javascript ruby-on-rails

我刚刚开始观看本教程的开头部分,介绍如何在Ruby on Rails应用程序中实现数据表。我已经遵循了前几个步骤,即只在Gemfile中添加gems,在javascript和css文件中添加必要的内容,然后将ID属性添加到表中。这应该至少可以让事情发挥作用。虽然

不适合我

这里是Railcasts演示文件只是为了获得一个非常基本的数据表而修改的文件:

    #Gemfile
    ...
    gem 'jquery-datatables-rails', github: 'rweng/jquery-datatables-rails'
    gem 'jquery-ui-rails'
    gem 'will_paginate'

#application.css
/*

 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
 * or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any styles
 * defined in the other CSS/SCSS files in this directory. It is generally better to create a new
 * file per style scope.
 *
 *= require_tree .
 *= require_self
 *= require dataTables/jquery.dataTables
 */

#assets/javascript/products.js
jQuery ->
    $('#products').dataTable()

#views/products.html.erb
<table class="table table-bordered table-hover table-condensed table-responsive" id="products">
  <thead>
    <tr>
      <th class="text-center"><%= check_box_tag "selectAll", "SelectAll" %></th>
      <th class="text-center">Product</th>
      <th colspan="3" class="text-center">Actions</th>
    </tr>
  </thead>

  <tbody>
    <% @products.each do |product| %>
    <tr>
      <td class="text-center"><%= check_box_tag "product_ids[]", product.id %></td>
      <td class="text-center"><%= product.id %></td>
      <td class="text-center"><%= link_to "<span class='glyphicon glyphicon-edit'></span>".html_safe, "#", class: "btn btn-xs btn-primary" %>
      <%= link_to "<span class=' glyphicon glyphicon-trash'></span>".html_safe, "#", method: :delete, data: { confirm: 'Are you sure?' }, class: "btn btn-xs btn-danger" %></td>
    </tr>
  <% end %>
  </tbody>
</table>
<%= render 'edit_multiple' %>
<% end %>

我知道这个演示比这更进一步,但这是他为了让它在最低限度上工作所做的。有什么想法吗?

1 个答案:

答案 0 :(得分:0)

您需要调整require dataTables/jquery.dataTables所在的位置。它看起来应该是这样的。

*= require_self
*= require dataTables/jquery.dataTables
*= require_tree .

此外,如果这不起作用,您应该发布application.js文件,并确保将其添加到那里。

//= require dataTables/jquery.dataTables
//= require_tree .

希望这会有所帮助。

相关问题