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.

Reply via email to