RadioButtonLists and Javascript

[Steve]

I have created an ASP.Net page that contains a RadioButtonList. I
want to access these radio buttons using Javascript. However when the
page renders, the application wraps the <input> tags inside a <span>
tag with the same name.

This makes the buttons difficult (if not impossible?) to access via
javascript. Any ideas? Am I trying to do mix two things that
Microsoft didn't intend to mix?

Code follows.

Thanks,
Steve



<script language=Javascript>
// The following does not work, since a span tag has no attribute
// named "value".
if (theForm.employeeIDType.value == "S")
{
// some code
}
</script>

<asp:radiobuttonlist id="employeeIDType" runat="server">
<asp:ListItem value="S" Selected=True>SSN</asp:ListItem>
<asp:ListItem value="G">Green Card</asp:ListItem>
</asp:radiobuttonlist>



This results in HTML as follows:

<span id="employeeIDType">
<input id="employeeIDType_0" type="radio" name="employeeIDType"
value="S" /><label for="employeeIDType_0">SSN</label>
<input id="employeeIDType_1" type="radio" name="employeeIDType"
value="G" /><label for="employeeIDType_1">Green Card</label>
</span>

 

[Scott M.]

Does the RadioButtonList have a "name" property as well as an "id" property.
If so, you could give the control a "name" that your JavaScript could use
and an "id" that the span tag would replicate.

 

[Rory Hanlon]

No, unfortunately that didn't help. Visual Studio complained that the
"name" property didn't exist, but it didn't stop me from putting it in.
The "name" property showed up in the HTML in the <span> tag. While the
HTML looked different, the end result was still that the javascript
didn't work.

Trying to do that same myself. No joy but creating HTML radio buttons
and then adding runat=server didn't cause any complaints in VS but the
related variables didn't appear in the aspx.cs code. I give up....

 

[vmn5xc]

Heyy Guys,

I was having the same problem. And finally it was solved.......

Try this.

var element = eval("document.forms[0]." + "RadioButtonList5");
alert(element[0].checked);
alert(element[1].checked);