JQuery.click event
I am trying to do this, when they click on <tr>
it will bring up a dialog box which works great. However, within that <tr>
I have an input checkbox that I have to allow them to click without opening the dialog. How is this possible?
$('#messageContainer tr').click(function () {
var masterMessageID = $(this).attr('messageID');
var replyToID = $(this).attr('replyToID');
buildDialog(this.id, masterMessageID, replyToID);
$(this).removeClass('messageNew');
});
HTML:
<tr replytoid="3" messageid="7078" id="16">
<td> <input type="checkbox" name="checkAll"></td>
<td>John Doe</td>
<td>sdfsdf</td>
<td>3/14/2012 1:29:47 PM</td>
</tr>
+3
James wilson
source
to share
4 answers
Stop click propagation:
$('#messageContainer tr :checkbox').click(function(e){
e.stopPropagation();
});
+6
Guffa
source
to share
You can add this code:
$('#messageContainer tr input:checkbox').click(function (e) {
e.stopPropagation();
});
This will stop clicking on the checkbox from propagate to tr.
Example - http://jsfiddle.net/U5LBR/1/
+1
Richard Dalton
source
to share
Edit: Changed from .is(':checkbox')
to checke.target.type
DEMO
$('#messageContainer tr').click(function (e) {
if (e.target.type && e.target.type == 'checkbox') {
e.stopPropagation(); //stop bubbling
return;
}
var masterMessageID = $(this).attr('messageID');
var replyToID = $(this).attr('replyToID');
buildDialog(this.id, masterMessageID, replyToID);
$(this).removeClass('messageNew');
});
0
Selvakumar Arumugam
source
to share
check it
Add checkbox event.stopPropagation () in checkbox. This will stop the bubble event.
$('#messageContainer tr').click(function () {
$('#popup').toggle();
});
$('#messageContainer input[type="checkbox"]').click(function(e){
alert('Checked');
e.stopPropagation();
})
http://jsfiddle.net/JLDzq/1/
0
Praveen vijayan
source
to share