<...">
Clever Geek Handbook

How to use partial, how to draw rows in striped tables in a dry way?

So, I have a view code that looks like this:

<div class="box-content">
    <table class="table table-properties">
        <tbody>             
            <%= render :partial => 'property', collection: @search.listings, as: :listing %>
        </tbody>
    </table>                                
</div>

In this _property.html.erb

I have this:

<tr>
    <td class="span2">
        <%= link_to listing_path(listing), :class => "thumbnail thumb2" do %>
            <%= image_tag "room_1.jpg", :alt => "Lucas" %>
        <% end %>
    </td>
    <td>
        <h2><%= link_to listing.headline, listing_path(listing) %></h2>
        <h5><%= listing.listing_type.name if listing.listing_type "#{listing.neighborhood.name.capitalize}" %></h5>
        <h5>Maintenance <%= number_to_currency(listing.maintenance) %></h5>
    </td>
    <td class="span1">
        <h2 class="price"><%= number_to_currency(listing.price)%></h2>
        <h5><%= "#{listing.num_bedrooms} bed, #{listing.num_bathrooms} bath" %></h5>
    </td>
</tr>

Basically, I want to generate this above code exactly, for each line the only difference is that I want every second line (i.e. all even lines) to have class=striped

.. ie <tr class=striped>

.

Thoughts on how to do this dry?

+3


source to share


4 answers


Have you tried using cycle

and current_cycle

?

http://api.rubyonrails.org/classes/ActionView/Helpers/TextHelper.html#method-i-cycle



<tr class="<%= cycle('odd', 'even') -%>">
  <!-- etc -->
</tr>

This will alternate your classes with odd

and even

, and IMHO should also work when rendering the collection. If you need the actual loop's value multiple times, you will get it with current_cycle

(because calling cycle

multiple times would mess up your loops if you didn't want to).

+11


source


Isn't it better to use a :nth-child()

css selector ? http://www.w3schools.com/cssref/sel_nth-child.asp



+1


source


You can try something like this:

 <tr class="<%=cycle("odd", "even") %>">
    <td class="span2">
        <%= link_to listing_path(listing), :class => "thumbnail thumb2" do %>
            <%= image_tag "room_1.jpg", :alt => "Lucas" %>
        <% end %>
    </td>
    <td>
        <h2><%= link_to listing.headline, listing_path(listing) %></h2>
        <h5><%= listing.listing_type.name if listing.listing_type "#{listing.neighborhood.name.capitalize}" %></h5>
        <h5>Maintenance <%= number_to_currency(listing.maintenance) %></h5>
    </td>
    <td class="span1">
        <h2 class="price"><%= number_to_currency(listing.price)%></h2>
        <h5><%= "#{listing.num_bedrooms} bed, #{listing.num_bathrooms} bath" %></h5>
    </td>
 </tr>
0


source


Do it with jquery:

$(document).ready(function(){
   $("table.table-properties > tbody > tr:odd").addClass("odd");
   $("table.table-properties > tbody > tr:not(.odd)").addClass("even");  
});
0


source






More articles:


All Articles