Question

I have an HTML table (that gets its data from a database, but thats besides the point) that has a checkbox for each row. Is ther an easy way to allow the user to check the checkbox by clicking anywhere in the row, rather than the checkbox itself? I know this can be done using javascript, but is there an easy way to do it in rails? Anyone know of any gems or tutorials online?

Answer 1

Here’s a working jsfiddle example: http://jsfiddle.net/3XZvV/2/

It uses the first checkbox in each table row. Put them in any <td>. You can show the checkboxes, but you’ll need to modify it to allow them to be clicked — this design doesn’t accommodate for clickable checkboxes since it fires the event when anything in that table row is clicked. (It was good enough for this question, but we’re open to improvements.)

Here’s the JavaScript to accomplish this:

$('.clickable tr').click(function() {
   var c = $(this).find(':checkbox').filter(':first');
   c.attr('checked', !c.attr('checked'));
   $(this).toggleClass('selected');
});

Just put class="clickable" on your table. In order to make it obvious that you can interact with rows, some CSS is nice. See the fiddle.