Radio Buttons in a DataList

Posted on 2004-08-26
Last Modified: 2010-08-05
I have a DataList control that has an image, a label, and a radio button in the ItemTemplate. My problem is that I can not group the radio buttons for some reason. I am setting the same GroupName property to every radio button in the ItemDataBoud event, but I can still select multiple radio buttons at the same time. Can anyone help please!
Question by:djaldogz

Expert Comment

ID: 11908024
when you view the source, what name does it give the radio?


Author Comment

ID: 11908096
<input id="ImageList0_ImageList__ctl1_radioSelect" type="radio" name="ImageList0:ImageList:_ctl1:SwatchGroup" value="radioSelect" />
<input id="ImageList0_ImageList__ctl2_radioSelect" type="radio" name="ImageList0:ImageList:_ctl2:SwatchGroup" value="radioSelect" />
<input id="ImageList0_ImageList__ctl3_radioSelect" type="radio" name="ImageList0:ImageList:_ctl3:SwatchGroup" value="radioSelect" />

SwatchGroup is the GroupName that I assigned to each radio button

Expert Comment

ID: 11908113
You will probably have to set the groupname programmatically after the DataList has been created.  itterate through all the items in the datalist and set each item's radiobutton's groupname.
Highfive Gives IT Their Time Back

Highfive is so simple that setting up every meeting room takes just minutes and every employee will be able to start or join a call from any room with ease. Never be called into a meeting just to get it started again. This is how video conferencing should work!


Author Comment

ID: 11908259
Just tried it.
Did this after the DataBind event:

for(int j=0; j < myColorSelector.ImageList.Items.Count; j++)
RadioButton myRadio = (RadioButton)myColorSelector.ImageList.Items[j].FindControl("radioSelect");
myRadio.GroupName = "SwatchGroup";

Didn't work, nor did it change the source at all.

LVL 10

Expert Comment

ID: 11910041
Confirm for me if I understand the situation:  You have one radio button in the ItemTemplate, not multiple buttons.  And when the data list shows you want to be able to select only one "item" by selecting that radio button, with any other selected radio buttons being de-selected.  This is what your html output looks like.  If I understand correctly, I have tried this myself just now a couple of different ways and it looks like you cannot override the name attribute with the GroupName property in a DataList like that.  I suspect the same would apply to the DataGrid.

You may need to use a link button that calls the Edit command, and then specify and EditItemTemplate to show something that marks the color as selected.

LVL 29

Accepted Solution

David H.H.Lee earned 250 total points
ID: 11910695
djaldogz ,

Use this :
client script
<script language="javascript">
function checkOne(selObj)
      var items=document.Form1 ; //your form name
      for(var i=0;i<items.length;i++)
            if(items.elements[i].type=="radio")//detect radio button
                  if(items.elements[i].id.indexOf("DataList1")>-1)//datalist name

<form id="Form1" method="post" runat="server">
<asp:DataList id="DataList1" runat="server">
      <asp:RadioButton ID="rdbEE" Runat="server" Text="Option" GroupName="EE"></asp:RadioButton>

 Private Sub DataList1_ItemDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.DataListItemEventArgs) Handles DataList1.ItemDataBound
        If e.Item.ItemType = ListItemType.AlternatingItem OrElse e.Item.ItemType = ListItemType.Item Then
            Dim rdbEE As RadioButton
            rdbEE = CType(e.Item.FindControl("rdbEE"), RadioButton)
            rdbEE.Attributes.Add("onClick", "javascript:checkOne('" & e.Item.ClientID & "_rdbEE')")
        End If
    End Sub


Author Comment

ID: 11915080
You understood the problem correctly. While a link button with an edit command would do the job, I really needed a radio button to work in this case. Thank you, though.


I tried your script, and it worked perfectly!

Thank you!

Featured Post

How to run any project with ease

Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
- Combine task lists, docs, spreadsheets, and chat in one
- View and edit from mobile/offline
- Cut down on emails

Join & Write a Comment

Introduction This article shows how to use the open source plupload control to upload multiple images. The images are resized on the client side before uploading and the upload is done in chunks. Background I had to provide a way for user…
International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
Sending a Secure fax is easy with eFax Corporate ( First, Just open a new email message.  In the To field, type your recipient's fax number You can even send a secure international fax — just include t…
This video discusses moving either the default database or any database to a new volume.

757 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

17 Experts available now in Live!

Get 1:1 Help Now