NCS Logo - Click for home page Northstar Developer Center
Platforms
All Platforms
.NET Framework (1.x - 4.x)
Active Server Pages
ASP.NET
C#
SQL Server
VB.NET
Visual Basic

Keywords
.NET Data Types
.NET E-mail
.NET Events
.NET Functions
.NET Object Programming
.NET System.Configuration
.NET System.Diagnostics
.NET System.IO
.NET System.Net
.NET System.Net.Sockets
Active Data Objects
ASP Architecture
ASP Black Belt
ASP Built-in Functions
ASP Built-in Objects
ASP Debugging
ASP Performance
ASP Security
ASP Syntax
ASP.NET Authentication
ASP.NET Controls
ASP.NET Data Access
ASP.NET Features
ASP.NET Master Pages
ASP.NET Page Events
ASP.NET Security
ASP.NET ViewState
Atom
Certifications
COM, DCOM, COM+
Data Access
E-Mail
Errors
Exporting Data
HTML Tips
IIS
Object-Oriented Programming
RSS
SQL
Uncategorized ASP Tips
VB API Programming
VB Forms
VB Syntax
XML

Book Support
Visual Basic 6 Bible
ASP Bible
ASP Weekend Crash Course
ASP.NET At Work
Creating Web Services

Using RadioButtons in a Repeater

Written by Eric Smith, Northstar Computer Systems LLC

The ASP.NET Repeater control is one of my favorites, mainly because it is fully customizable and it allows me to build many types of applications. However, it does have a few downsides in terms of which controls it can host. If you try to add a RadioButton control into a Repeater's ItemTemplate or AlternatingItemTemplate, you end up with a situation where all your RadioButtons can be checked. This obviously isn't a good thing.

In case you haven't used them in ASP.NET, RadioButton controls each have a unique ID but a common GroupName parameter. This allows the RadioButton controls to work together as a group. However, a Repeater mangles the control IDs and group names, causing them to not work correctly. The fix is a simple bit of JavaScript that you can add to pages with Repeaters and RadioButton controls. This function was originally provided in a newsgroup by Microsoft support and appears to be a reliable fix.

This is the code for the JavaScript function:

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 code is linked to the Repeater through the ItemDataBound event. For it to work properly, you need to know the name of the Repeater control, as well as the GroupName you're assigning to the RadioButtons. In this case, I'm using rptPortfolios as the name of the Repeater, and Portfolios as the group name:

protected void rptPortfolios_ItemDataBound(object sender,
                                           RepeaterItemEventArgs e)
{
   if (e.Item.ItemType != ListItemType.Item && e.Item.ItemType
      != ListItemType.AlternatingItem)
      return;
   RadioButton rdo = (RadioButton)e.Item.FindControl("rdoSelected");
   string script =
      "SetUniqueRadioButton('rptPortfolios.*Portfolios',this)";
   rdo.Attributes.Add("onclick", script);
}

The end result of this code is properly functioning RadioButton controls with minimum hassle. This code works equally well in ASP.NET 1.1 and 2.0.

Keywords: [ ASP.NET Controls ]

Publication Date: 7/15/2006, Last Update: 12/10/2010