Rails button_to or link_to image -

noob needed. creating chore chart children should online version of:

http://learningandeducationtoys.guidestobuy.com/i-can-do-it-reward-chart

chores listed down y-axis , days (sun, mon... ) on top x-axis. boxes kids click , receive stars completed chores.

the chores/index.html.erb table ugly code (sorry):

listing chores

  <table>     <th><%= "" %></th>     <th><%= "sun" %></th>     <th><%= "mon" %></th>     <th><%= "tues" %></th>     <th><%= "wed" %></th>     <th><%= "thurs" %></th>     <th><%= "fri" %></th>     <th><%= "sat" %></th>     <% @chores.each |chore| %>     <tr class="<%= cycle('list-line-odd', 'list-line-even') %>">      <%     ##todo.. fix sure link "post" action "show" child. %>     <td>       <%= image_tag(chore.image_url, :class => 'list-image') %>       <dt><%=h chore.title %></dt>     </td>      <td class="button"><%= button_to "add wallet", wallets_path(:chore_id => chore, :child_id => session[:child_id]),     :remote => true %></td>     <td class="button"><%= button_to "add wallet", wallets_path(:chore_id => chore, :child_id => session[:child_id]),     :remote => true %></td>     <td class="button"><%= button_to "add wallet", wallets_path(:chore_id => chore, :child_id => session[:child_id]),     :remote => true %></td>     <td class="button"><%= button_to "add wallet", wallets_path(:chore_id => chore, :child_id => session[:child_id]),     :remote => true %></td>     <td class="button"><%= button_to "add wallet", wallets_path(:chore_id => chore, :child_id => session[:child_id]),     :remote => true %></td>     <td class="button"><%= button_to "add wallet", wallets_path(:chore_id => chore, :child_id => session[:child_id]),     :remote => true %></td>     <td class="button"><%= button_to "add wallet", wallets_path(:chore_id => chore, :child_id => session[:child_id]),     :remote => true %></td>     </tr>   <% end %> </table> </div> 

the above creates "add wallet" buttons each chore each day. wallets join table between children , chores tables. 2 questions:

1. how switch buttons boxes in table which, when clicked, turn stars images (as per example)?
2. how refactor code in table don't violate dry rule?

there's sort of 2 questions in 1 here makes awkward answer. dry part should recognize you're copy-pasting same statement many times on , bad form. sort of thing better expressed kind of loop single instance of statement.

an example rolling days constant stored somewhere, using that:

<% days.each |day| %> <th><%= day_name %></th> <% end %> 

days defined somewhere convenient, in model associated this, or of sort. may require prefix mymodel::days if case, work same.

it's not clear why you're using pattern <%= "x" %> has effect of returning same string every time when x well.

you can iterate on 7 other td elements same principle:

<% days.each |day| %> <td class="button"><%= button_to "add wallet", wallets_path(:chore_id => chore, :child_id => session[:child_id]), :remote => true %></td> <% end %> 

even though day variable isn't used, driving factor here is, apparently, number of days, makes sense. if had 5 day week, columns shrink accordingly.

as second part of question, you're looking best expressed jquery onclick handler table cells. using unobtrusive javascript techniques, can define action on entire class of dom elements quite easily:

$('td.button').live('click', function () { ... }); 

you'd fill in ... part ajax call fetches , updates cell. there's no need actual button inside cell @ point, css make cell right size , color. style reasons applied element inside cells adjusting selector accordingly.