how do I create a table using loops and haml with

问题:

I'm trying to make an html table that looks like this:

1 2 3 4 5
1 2 3 4 5
1 2 3 4 5

My data structure is like this: @f_ary = [ 1..250]

Here's my haml code:

%table{:border => "1"}
  %tbody
    %tr 
      - cnt = 0 
      - @f_ary.each do |f| 
        - cnt += 1
        %td= cnt 
        - if cnt == 5
          - cnt = 0 
          %tr 

My current output looks like this:

<table border='1'>
  <tbody>
    <tr>
      <td>1</td>
      <td>2</td>
      <td>3</td>
      <td>4</td>
      <td>5</td>
      <tr></tr>
      <td>1</td>
      <td>2</td>
      <td>3</td>
      <td>4</td>
      <td>5</td>
    </tr>
  </tbody>
</table>

I want it to look like this:

<table border='1'>
  <tbody>
    <tr>
      <td>1</td>
      <td>2</td>
      <td>3</td>
      <td>4</td>
      <td>5</td>
    </tr>
    <tr>
      <td>1</td>
      <td>2</td>
      <td>3</td>
      <td>4</td>
      <td>5</td>
    </tr>
  </tbody>
</table>

回答1:

You should try to put all the logic for creating the rows and columns array in your controller. Rendering the view in Haml then becomes very simple:

Controller:

@items = [
  [1,  2,  3,  4,  5],
  [6,  7,  8,  9,  10],
  [11, 12, 13, 14, 15]
]

View:

%table
  %tbody
    - @items.each do |row|
      %tr
        - row.each do |column|
          %td= column

If you have a flat array of items rather than an array of arrays as in my example, you can easily convert it with flat_array.each_slice(5).to_a, where 5 is the number of columns.

回答2:

You can use the each_slice like so:

- @f_ary.each_slice(5) do |row|
  %tr
    - row.each do |cnt|
      td=cnt

回答3:

update

This could be the most un-ruby way of doing it, (I did this around 3 years back). So

check out above answers & they are much more better

I will just keep this answer without deletion, just as a reference on, how NOT to do it... ;)

---

Have an internal counter in the view, when it comes to 5, add a . psudo will look some thing like this

couneter = 0 

@items.each |item|
   if counter == 0
    <tr>
   end
   if counter != 5
     <td>item</td>
     counter ++
   end
   if counetr == 5
     </tr>
     counetr = 0
   end 

end


end

I hope u get the idea

cheers

sameera