Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to add a hyperlink to a Table Row <tr>

Tags:

html

jquery

css

I created a table, but i can't get the HTML link working, which I want to include in the tablerow.

<table class="list" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<th width="10%"></th>
<th width="30%">Titel</th>
<th width="20%">Typ</th>
<th width="10%">Jahr</th>
<th width="14%">Anzahl</th>
<th width="8%"><img title="Dub" src="IMG" alt="Dub" /></th>
<th width="8%"><img title="Sub" src="IMG" alt="Sub" /></th>
</tr>
<td><img src="IMG" alt="" /></td>
<td style="padding-top: 15px;">XYXYXYXYXY</td>
<td style="padding-top: 15px;">XCXYX</td>
<td style="padding-top: 15px;">XYXYX</td>
<td style="padding-top: 15px;">XXXXX</td>
<td style="padding-top: 15px;"><img src="XYXYXYXYXY" alt="" /></td>
<td style="padding-top: 15px;"><img src="XYXYXYXYXY" alt="" /></td>
</tr>
<td><img src="XYXYXYXYXY" alt="" /></td>
<td style="padding-top: 15px;">XYXYXYXYXY</td>
<td style="padding-top: 15px;">XYXYXYXYXY</td>
<td style="padding-top: 15px;">XXXXX</td>
<td style="padding-top: 15px;">XYXYX</td>
<td style="padding-top: 15px;"><img src="XYXYXYXYXY" alt="" /></td>
<td style="padding-top: 15px;"><img src="XYXYXYXYXY" alt="" /></td>
</tr>
</tbody>
</table>

A fiddle: http://jsfiddle.net/pjPTd/

I tried it with using jquery, but i couldnt get it work.

like image 913
user3850699 Avatar asked Oct 01 '22 07:10

user3850699


2 Answers

To make a table row clickable, put the href inside of your row tag:

<tr href="http://www.example.com">

Then use this jquery: FIDDLE

$(document).ready(function(){
    $('table tr').click(function(){
        window.location = $(this).attr('href');
        return false;
    });
});
like image 198
Lei-Lonnie Avatar answered Oct 02 '22 22:10

Lei-Lonnie


your question is not clear at all, if you want to add a link to a table cell you can simply use the <a> tag, see bellow:

<a href="http://google.com"> click to visit google </a>

add this inside a <td> and you will get a link that takes you to google.

next time make your question clear and general so that others can use it as well.

update:

if you mean by clickable a button then you should probably visit button tag w3schools

like image 24
Fanckush Avatar answered Oct 02 '22 22:10

Fanckush