List of radio buttons in repeater mode

Question

I have a relay on my page. I need to have a switch in all lines (element template) when checking the radio button, the rest of the switches should be unchecked.

How to do it?

Thanks in advance, Tor

Answer 1

Unfortunately, this is a known bug ( http://support.microsoft.com/kb/316495 ) that the GroupName property does not work properly when used in a repeater. The problem is that Repeater implements the INamingContainer interface, which requires that all nested controls have a unique name when rendering HTML. This causes the switches to break, because they must have the same name to work properly.

There are two workarounds I met:

1 - The first client-side JavaScript solution. It was provided by Microsoft support . Or an easier to read version here . The instructions are as follows. Include the following javascript in HEAD:

function SetUniqueRadioButton(nameregex, current) { re = new RegExp(nameregex); for(i = 0; i < document.forms[0].elements.length; i++) { elm = document.forms[0].elements[i] if (elm.type == 'radio') { if (re.test(elm.name)) { elm.checked = false; } } } current.checked = true; } 

The function should now be associated with the radio devices in the OnDataItemBound event of the repeater. Replace “RadioButton” with the name of your RadioButton control and “RadioGroup” with the GroupName of your choice:

 protected void Repeater1_ItemDataBound(object sender, RepeaterItemEventArgs e) { if (e.Item.ItemType != ListItemType.Item && e.Item.ItemType != ListItemType.AlternatingItem) return; RadioButton rb = (RadioButton) e.Item.FindControl("RadioButton"); string script = "SetUniqueRadioButton('Repeater1.*RadioGroup',this)"; rb.Attributes.Add("onclick", script); } 

2 - The second solution is a server-side solution that uses user control, which inherits from RadioButton. The tutorial and source code can be downloaded here: http://www.codeproject.com/KB/webforms/How_group_RButtons.aspx

Answer 2

Just add the OnCheckedChanged event to the radio button, looping all the radio buttons in the repeater to unmark them. You can use the UpatePanel if you don't need a postback .

.aspx

 <asp:Repeater ID="Repeater1" runat="server" > <ItemTemplate> <asp:RadioButton ID="RadioButton1" runat="server" OnCheckedChanged="RadioButton1_OnCheckedChanged" AutoPostBack="true" /> </ItemTemplate> </asp:Repeater> 

.cs

 protected void RadioButton1_OnCheckedChanged(object sender, EventArgs e) { foreach (RepeaterItem item in Repeater1.Items) { RadioButton rbtn = (RadioButton)item.FindControl("RadioButton1"); rbtn.Checked = false; } ((RadioButton)sender).Checked = true; } 

Answer 3

I know this is deprecated, but the reason the buttons don't work is because the name attribute is overwritten. If you use jQuery, you can assign a switch to the class, and then set the name attribute to override the new name.

 $('.MyRadioClass').attr("name","MyFixedName"); 

Answer 4

Another simpler alternative that does not need formatting is to use a RadioButtonList:

 <asp:RadioButtonList ... />