Question

I have a table with a checkbox in each row. I want to do a .click function that happens when I click anywhere on the tr other than the checkbox.

The rows have class=”message” and the td that contains the checkbox has class=”ignore_checkbox”.

this is my jquery/js:

$('.message').not('.ignore_checkbox').click(respondToMessage);

but it still calls respondToMessage function when I click the checkbox. Any ideas?

<?php foreach ($accountMessages as $accountMessage): ?>
<tr class="message overview">
    <td class="ignore_checkbox" ><?php echo $this->Form->checkbox(
        'AccountMessages.'.$accountMessage['AccountMessage']['id'], 
        array('value' => $accountMessage['AccountMessage']['id'],
        'hiddenField' => false,
        'multiple' => true)); ?>
    </td>
    <td>
        <strong><?php echo h($accountMessage['Account']['email']);?></strong><br/>
        <span class="message_time"><?php echo $this->Time-                      TimeAgoInWords($accountMessage['AccountMessage']['created'], array('format' => 'F jS, Y', 'end' => '+1 year') )?></span>
        <?php echo h($accountMessage['AccountMessage']['title']); ?><br/>
        <?php echo h($accountMessage['AccountMessage']['message']); ?>

    </td>
</tr>
<?php endforeach; ?>

Answer 1

Simply add the td to your existing rule like:

$('.message td').not('.ignore_checkbox').click(respondToMessage);

Your idea of using .not() works but it only works on matching elements. Since your rule starts at the table row <tr>, the .not() doesn’t match anything. By instead matching on the table cells <td> it works fine.

Here’s a quick jsFiddle example.