Hi Peter, I'd suggest one of the following, depending on your
circumstances:
1. Try cancelling the event bubbling by returning false from your
click event handler.
2. Let html do the work by filling the TD with a label element like
this: <label for="mycheckboxID"><input type="radio"
id="mycheckboxID"></label> (Not the best option if you are being
strict about your markup standards)
Can you use css for the layout instead of a table or are you
presenting tabular data?
George
On May 4, 9:45 am, Peter Bengtsson <[EMAIL PROTECTED]> wrote:
> This is the HTML I have to work with:
> <table>
> <tr>
> <td class="foo">
> <input type="radio" name="tra" value="one" />
> </td>
> <td class="foo">
> <input type="radio" name="tra" value="two" />
> </td>
> </tr>
> </table>
>
> My first attempt was this::
>
> $('td.foo').click(function() {
> $(this).children()[0].checked = !$(this).children()[0].checked;
> });
>
> That works fine when you press anywhere inside the TD and it checks
> the radio button. So far so good. The problem is when you click on the
> actual radiobutton. That "natural" click checks the radio button but
> the parenting TD onclick reverses it immediately. I hope it makes
> sense.
> What can I do to prevent this?
>
> I tried::
>
> $('td.foo').click(function() {
> $(this).children()[0].checked = !$(this).children()[0].checked;
> });
> $('td.foo input').unbind('click');
>
> but it didn't work.
