Rails Array to HTML Table

Question

I have an array coming from a rails app, and I'm getting the following array.

[
  #<InvoiceDetail id: 66018858, invoice_id: 108855, package_id: 21008265, tracking_num: "1Z1Y81420342195332", base_charge: #<BigDecimal:7fed215e7188,'0.857E1',18(18)>, discount: #<BigDecimal:7fed215e70e8,'-0.308E1',18(18)>, created_at: "2012-07-30 15:33:43", updated_at: "2013-02-27 15:31:16", type_id: 54, transaction_date: "2012-07-23", gl_code: nil, division: nil>,
  #<InvoiceDetail id: 66018912, invoice_id: 108855, package_id: 21008282, tracking_num: "1Z1Y81420341336904", base_charge: #<BigDecimal:7fed215e5e78,'0.823E1',18(18)>, discount: #<BigDecimal:7fed215e5d88,'-0.274E1',18(18)>, created_at: "2012-07-30 15:33:44", updated_at: "2013-02-27 15:31:16", type_id: 54, transaction_date: "2012-07-23", gl_code: nil, division: nil>,
  #<InvoiceDetail id: 66019132, invoice_id: 108855, package_id: 21008350, tracking_num: "1Z1Y81420340443595", base_charge: #<BigDecimal:7fed215e4988,'0.995E1',18(18)>, discount: #<BigDecimal:7fed215e48e8,'-0.428E1',18(18)>, created_at: "2012-07-30 15:33:46", updated_at: "2013-02-27 15:31:16", type_id: 54, transaction_date: "2012-07-24", gl_code: nil, division: nil>,
  #<InvoiceDetail id: 66019370, invoice_id: 108855, package_id: 21008425, tracking_num: "1Z1Y81420341794357", base_charge: #<BigDecimal:7fed215ef608,'0.904E1',18(18)>, discount: #<BigDecimal:7fed215ef568,'-0.355E1',18(18)>, created_at: "2012-07-30 15:33:48", updated_at: "2013-02-27 15:31:16", type_id: 54, transaction_date: "2012-07-26", gl_code: nil, division: nil>,
  #<InvoiceDetail id: 66018877, invoice_id: 108855, package_id: 21008271, tracking_num: "1Z1Y81420341786795", base_charge: #<BigDecimal:7fed215ee208,'0.736E1',18(18)>, discount: #<BigDecimal:7fed215ee118,'-0.187E1',18(18)>, created_at: "2012-07-30 15:33:43", updated_at: "2013-02-27 15:31:16", type_id: 54, transaction_date: "2012-07-23", gl_code: nil, division: nil>,
  #<InvoiceDetail id: 66018894, invoice_id: 108855, package_id: 21008276, tracking_num: "1Z1Y81420341777849", base_charge: #<BigDecimal:7fed215ecd18,'0.823E1',18(18)>, discount: #<BigDecimal:7fed215ecc78,'-0.274E1',18(18)>, created_at: "2012-07-30 15:33:44", updated_at: "2013-02-27 15:31:16", type_id: 54, transaction_date: "2012-07-23", gl_code: nil, division: nil>
]

I'm looking to parse out that data into a html table. Still pretty new with Rails and not sure where to start on this one.

Edit:

Here is what I'd like the the table to take a look like.

       <table class="table table-condensed">
          <thead>
            <tr>
              <th>Invoice Id</th>
              <th>Package Id</th>
              <th>Tracking Number</th>
              <th>Base Charge</th>
              <th>Discount</th>
              <th>Type Id</th>
              <th>Transaction Date</th>
              <th>Gl Code</th>
              <th>Division</th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>108855</td>
              <td>21008265</td>
              <td>1Z1Y81420342195332</td>
              <td>8</td>
              <td>-3</td>
              <td>54</td>
              <td>2012-07-23</td>
              <td>nil</td>
              <td>nil</td>
            </tr>
          </tbody>
        </table>

Why don't you show us what code you've written, and what you want that table to look like, and which fields you want in the columns? As is, this is a very ambiguous question and it looks like you just threw it out there without trying. — the Tin Man
– the Tin Man, Commented May 2, 2013 at 1:17

fotanus · Accepted Answer · 2013-05-02 11:51:18Z

5

For a generic list of the same objects, you can go with something like (not tested)

<table>
  <thead>
    <tr>
      <% @array.first.attributes.each do |attr| %>
        <th><%= attr.titlelize %></th>
      <% end %>
    </tr>
  </thead>
  <tbody>
    <% @array.each do |x| %>
      <tr>
        <% x.attributes.each do |attr| %>
          <td><%= x[attr] %></td>
        <% end %>
      </tr>
    <% end %>
  </tbody>
</table>

Or simple use datagrid gem

ps.: I wrote this answer before the user give an example of how he wanted his table to look like. For that exact table, check @ankita answer.

edited May 2, 2013 at 11:51

answered May 2, 2013 at 1:25

fotanus

20.3k15 gold badges81 silver badges112 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Bradley Priest Over a year ago

A couple of hints. - Use attr.titleize in your th's - Always be careful using send. With ActiveRecord I'd suggest x[attr]

fotanus Over a year ago

Thanks, the x[attr] is a nice catch. Updated - feel free to update my answer as you find better

user2340027 · Accepted Answer · 2013-05-02 06:09:13Z

fotanus' answer is correct. But if you want the columns to be in particular order, use this

<table class="table table-condensed">
      <thead>
        <tr>
          <th>Invoice Id</th>
          <th>Package Id</th>
          <th>Tracking Number</th>
          <th>Base Charge</th>
          <th>Discount</th>
          <th>Type Id</th>
          <th>Transaction Date</th>
          <th>Gl Code</th>
          <th>Division</th>
        </tr>
      </thead>
      <tbody>
        <% @invoice_details.each do |invoice_detail| %>
          <tr>
            <td><%= invoice_detail.id %></td>
            <td><%= invoice_detail.package_id %></td>
            <td><%= invoice_detail.tracking_number %></td>
            <td><%= invoice_detail.base_charge %></td>
            <td><%= invoice_detail.discount %></td>
            <td><%= invoice_detail.type_id %></td>
            <td><%= invoice_detail.transaction_date %></td>
            <td><%= invoice_detail.gl_code %></td>
            <td><%= invoice_detail.division %></td>
          </tr>
        <% end %>
      </tbody>
    </table>

Note: Column names were assumed.

AKovtunov · Accepted Answer · 2013-05-02 11:55:02Z

0

Also, if you are new with Rails, you can make scaffold and look, how they did view files.

answered May 2, 2013 at 11:55

AKovtunov

5771 gold badge6 silver badges21 bronze badges

Collectives™ on Stack Overflow

Rails Array to HTML Table

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related