Make table row clickable

Question

I have a table row that has background color on hover. When user clicks within the background color area, it should grab the link of the anchor tag inside the row and take t

Answer 1

In your case

$('#ClickableRow').click(function () {
   window.location = $("#ClickableRow a:first").attr('href');
});

You can test on http://jsfiddle.net/.

To make it look like clickable you can add this

JavaScript:

$('#ClickableRow').hover(
    function () {
        if ($(this).find("th").length > 0) return;
        $(this).addClass("gridRowHover");
    },
    function () { $(this).removeClass("gridRowHover"); }
);

CSS

.gridRowHover{
    cursor: pointer;
 }

Generic function, to make any row of table clickable

function bindRowClick(itemId, eventHandler) {  
    var binder = "tr"; 
    $("#" + itemId).find(binder).click(eventHandler); 
}

ItemId will be your table id and eventHandler is the function to be executed.