Jquery: how to trigger td a when tr is clicked
Question
I have a table where the first td in the trs contains a link. I want this anchor to be triggered (clicked) no matter where i click in the containing tr.
I have read and tried alot of recents post and suggentions on this topic but i can't get this to work. I tried the trigger() and triggerHandle() functions, but it does not trigger the anchor click that i want.
There must be others who have had the need to trigger a anchor click when a tr is clicked, so that the user doesn't have to click the tds anchor link. It sure is a nice UI feature if its possible?
Here is the code i have tried:
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="javascripts/jquery-1.4.2.js"></script>
<script type="text/javascript" charset="utf-8">
/* Initialise the table with the required column sorting data types */
jQuery(document).ready(function () {
jQuery("#rowClick tr").click(function (e) {
jQuery("#clickevent", this).trigger("click");
});
});
</script>
</head>
<body id="dt_example">
<table id="rowClick">
<thead>
<tr>
<th style="width: 30px">id</th>
<th style="width: 200px">navn</th>
</tr>
</thead>
<tbody>
<tr>
<td><a href="datatabletext.asp?test=1" id="clickevent">1</a></td>
<td>Jesper</td>
</tr>
<tr>
<td><a href="datatabletext.asp?test=2" id="clickevent">2</a></td>
<td>Bjarne</td>
</tr>
<tr>
<td><a href="datatabletext.asp?test=3" id="clickevent">3</a></td>
<td>Søren</td>
</tr>
</tbody>
</table>
</body>
5 answers
solution1
3 ACCPTED 2010-05-14 07:42:55
Following on from naugtur and Alessandro; with the tds changed to have a class of 'clickevent':
$(document).ready(function () {
$("#rowClick tr").click(function (e) {
document.location.href = $(this).find(".clickevent").attr('href');
});
});
solution2
2 2010-05-14 07:36:12
triggering clicks on a to reload the page is unavaliable due to security reasons.
try this way:
document.location.href=$aintd.attr('href');
$aintd is the a element You found
solution3
1 2010-05-14 07:37:22
jQuery("#rowClick tr").click(function (e) {
jQuery(this).find('td:first a').click();
});
I should add that naugtur is correct in that this won't take you to another page, but anything that happens on the page itself will work fine.
solution4
0 2010-05-14 07:40:37
Yeah, x1a4 is right. And remove the ids "clickevent" from your tds; the id attribute must be "a primary key" for a DOM element.
solution5
0 2010-05-14 07:43:00
try the following
$("#rowClick tr").click(function (e) {
$(this).find('td:first a').trigger('click');
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.