mattq mattq - 2 years ago 247
Javascript Question

Rails 3 - How to make entire table row clickable using jQuery

I have a private messaging system that displays an "inbox" view of all received messages. This view is simply generated from multiple table rows created by using a block in the view.

I would like to make each table row "clickable" and also pass a parameter (just as if I was using a standard link_to). However, as you may know, you cannot make a tr clickable like you can with a div.

Therefore, I believe the solution will require some simple jQuery. I have found some partial answers to this question, but not a complete one.

I know the code below is NOT correct (the link_to part), but can someone please show me how to hook up a rails link_to link using a jQuery click function?


$('tr').click(function() {
<%= link_to :controller => "messages", :action => "show", :id => msg.convo_id %>

Answer Source

This is what I found and it seems to work perfectly (note: 'conver' is the class name of each table row).

$('.conver').click(function() {
  var href = $(this).find("a").attr("href");
  if(href) {
    window.location = href;
});  // end

Additionally, my "inbox" view has checkboxes in each row that I use to select a particular message and fire certain options such as save, delete, etc. I needed to be able to check these checkboxes WITHOUT firing the link to the message. Therefore, I added the following code:

$(':checkbox').click(function(event) {
 });  // end

Hope this helps anyone trying to generate these same features that are common to most messaging systems.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download