Description

table_for_collection is a simple gem used to render tables based on the given collection.

Install

Just add to your Gemfile

gem 'table_for_collection'

Simplest examle

<%= table_for @users do -%>
  <% columns :name, :email, :address %>
<% end %>

In this case you just put fields list to the :columns method. This ruby code will produce following HTML:

<table>
  <thead>
    <tr>
      <th>Name</th>
      <th>Email</th>
      <th>Address</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>John Smith</td>
      <td>john.smith@example.com</td>
      <td>100 Spear St., NY, USA</td>
    </tr>
  </tbody>
</table>

Simple examle

<%= table_for @users, :html => {
  :class => "simple-table",
  :id => "users",
  :width => "100%",
  :tr => {
    :class => "simple-row",
    :id => lambda { |user| "user-row-#{user.id}" }
  }
} do -%>
  <% column :name, :html => { :th => { :width => "25%" }, :td => { :class => "user-name" }} %>
  <% column :email, :width => "20%" %>
  <% column :address, :title => "Home" %>
  <% column :created_at, :title_callback => lambda { |title| link_to(title, users_path(params.merge(:order => "desc"))) } %>
<% end %>

You can put :html hash to the options list (inside the :column method too). In this case table will be created with given html attributes. To assign :tr options use :tr key under :html - :class value will be added to the classes list, :id can be instance of the Proc class, in this it will be called for each collection element. For column width you can use shortcut :width, remember that :width shortcut has higher priority. Also :title value in the :column method will be used as column’s title. You can pass Proc object to the :title_callback param. In this case given proc will be called with title value. It will produce HTML similar to:

<table class="simple-table" id="users" width="100%">
  <thead>
    <tr>
      <th width="25%">Name</th>
      <th width="20%">Email</th>
      <th>Home</th>
      <th><a href="/users?order=desc">Created At</a></th>
    </tr>
  </thead>
  <tbody>
    <tr class="simple-row" id="user-row-12">
      <td class="user-name">...</td>
      <td>...</td>
      <td>...</td>
      <td>...</td>
    </tr>
    <tr class="simple-row" id="user-row-14">
      ...
    </tr>
  </tbody>
</table>

More complex example

<%= table_for @users do -%>
  <% column :login, :title => "User name" %>
  <% column :email do |email| %>
    <% mail_to email %>
  <% end %>
  <% column :title => "Full name" do |user| %>
    <% [user.first_name, user.last_name].join(" ") %>
  <% end %>
  <% column :company %>
  <% column :title => "Actions" do |user| %>
    <% [link_to("Show", user), link_to("Delete", user, :method => :delete)].join(" | ") %>
  <% end %>
  <% column :created_at, :time_format => "%Y-%m-%d" %>
<% end %>

Example with colorized rows

<%= table_for @users, :html => { :tr => { :class => "row" } }, :stripes => %w{even odd} do %>
  <% column :name %>
  <% column :email %>
  <% column :address %>
<% end %>

Also class given by :stripe option will be merged with options[:tr] so this code will produce following HTML:

<tr class="row even">...
<tr class="row odd">...
<tr class="row even">...
<tr class="row odd">...

I18n

When column name is set, but :title is not, helper tries to find translation in standard mechanism of the ActiveModel. For more information visit: guides.rubyonrails.org/i18n.html#translations-for-active-record-models

Known issues

Unfortunately it works incorrect if there is no “-” before %> in this code:

<%= table_for @users do -%>

We hope it will be fixed soon.