Stanmx

Buscando la accesibilidad

Tablas zebra en rails3

Publicado en ruby-on-rails el 02/09/10 a las 09:07 am

Dentro de los mockups de una app en la que estoy trabajando, utilizo tablas con estilo zebra, el detalle es que en rails3 no sabia si utilizar javascript o si habia otra forma de resolverlo.

Asi llegue a un metodo llamado cycle el cual me permite hacer este trabajo.

Ejemplo:

<table>
   <!-- aqui va thead -->
   <tbody>
      <% @hotels.each do |hotel| %>
      <tr class="<%= cycle("first", "second") %>">
	     <td><%= hotel.name %></td>
         <td><%= hotel.location %></td>
      </tr>
      <% end %>
   </tbody>
</table>

Y dentro de nuestro CSS.

.second {
   background-color: #eee;
}

y listo!

Post relacionados

4 comentarios

Marcel Miranda

dijo el 02/09/10 a las 10:33 am

Aunque los IE antes del 9 no dan soporte a este tipo de selectores CSS, me gusta usar

table tbody tr:nth-child(odd) {
background-color: #eee;
}

junto con http://code.google.com/p/ie7-js/ que lo soluciona para los demás IE's

Stan

dijo el 02/09/10 a las 11:25 am

Gracias Marcel por el tip :D

Mario A Chavez

dijo el 02/09/10 a las 12:41 pm

Creo que es mejor si lo pones asi:








En un archivo parcial llamado _hotel.html.erb:





Mario A Chavez

dijo el 02/09/10 a las 12:43 pm

Parece que se comio mi codigo el blog, pero a lo voy es que lo puedes hacer de esta forma y quitas el ciclo each:

http://gist.github.com/562825

Aporta tu comentario

Tu Email no sera publicado.

Opcional.