Access instance of a Radiobutton from Radiobuttonlist through Javascript

.NET
1

If we are using ASP.NET Radiobuttonlist in our page it becomes a little difficult to find the instance of it through Javascript because it is rendered in a different way in the browser ( the code is reproduced below )

ASP.net Code

<asp:RadioButtonList ID=“RadioButtonList1” runat=“server” RepeatLayout=“Table”>
<asp:ListItem Text=“AAA”></asp:ListItem>
<asp:ListItem Text=“BBB”></asp:ListItem>
</asp:RadioButtonList>

Is rendered in browser as :

<table id=“RadioButtonList1” border=“0”>
<tr>
<td><input id=“RadioButtonList1_0” type=“radio” name=“RadioButtonList1” value=“AAA” /><label for=“RadioButtonList1_0”>AAA</label></td>
</tr>
<tr>
<td><input id=“RadioButtonList1_1” type=“radio” name=“RadioButtonList1” value=“BBB” /><label for=“RadioButtonList1_1”>BBB</label></td>
</tr>
</table>

2

Well, what exactly do you want to do with the js?

3

This is a problem which will hopfully be sorted with ASP.NET 4 (which I hope I never actually have to deal with again but avoiding any Webforms work!). If the all the options are manually defined in the list you could add a CSS class that identifies each. Not perfect but it allows you to get around the mangled ID issue.

Or you can use jQuery to travse the the DOM to get access if it’s always going to be in the same place or match it Id with some regular expressions.