Question

I am using an asp radio button group to list out answers in a form. Here is an example of the structure.

<asp:RadioButtonList id="Q2" runat="server">
    <asp:ListItem Text="Go to <a  target='_blank' href='http:www.google.com'>Google</a>"  Value="a"></asp:ListItem>
    <asp:ListItem Text="Go to <a  target='_blank' href='http:www.yahoo.com'>Yahoo</a>"  Value="a"></asp:ListItem>
 </asp:RadioButtonList>

So I want to be able to click on the links and not have the radiobutton associated with it become selected. In IE it works fine but in Firefox the radio button will be selected when i click on the link. I don’t really need the label to actually select the proper radio button so is there a way to just disable them either in javascript or somewhere in the asp or C# code?

Answer 1

It’s undoubtedly wrapping them within a label element which is giving you the select behavior. You could either generate the code manually — my choice — or unwrap them with javascript on the client side.

<div>
    <input type="radio" name="Q2" id="Q2_google" value="google" /> <a target="_blank" href="http://www.google.com">Google</a>
    ...
</div>

or client-side

 $(function() {
     $('label:has(a)').each( function() {
         var html = $(this).html();
         $(this).replaceWith($(html));
     });
 });