Radio buttons in a datagrid

[mendhak]

I've added radio buttons to a templatecolumn in a datagrid like so:

<asp:TemplateColumn HeaderText="Sel. One" ItemStyle-HorizontalAlign="Center">
	<HeaderStyle Width="0%">
	</HeaderStyle>
	<ItemTemplate> 
		<input type="radio" name="rdSelect" id="rdSelect" runat="server">
	</ItemTemplate>
</asp:TemplateColumn>

Once the datagrid is populated, the radio column does show up, but I am able to select all radio buttons. What should I do to allow the selection of just one radio button?

[mendhak]

Edit: spoke too soon. I'm now unable to access it in server side code if I remove the runat="server", so my original question stands.

Anyone?

[mendhak]

I came up with a not very elegant solution:

First, I declare global vars:

		ArrayList jstring = new ArrayList();
		int jcount;
		public string script;

Then, in the datagrid's itemdatabound event:

HtmlInputRadioButton rb = new HtmlInputRadioButton();
			
			if ((e.Item.ItemType== ListItemType.Item) || (e.Item.ItemType == ListItemType.AlternatingItem))
			{
				rb = (HtmlInputRadioButton)e.Item.FindControl("rdSelect");
				//jstring = jstring + ":" + rb.ClientID.ToString();
				//jstring[jcount] = rb.ClientID.ToString();
				jstring.Add(rb.ClientID.ToString());
				
			
				rb.Attributes.Add("onClick","UncheckOthers(\"" + rb.ClientID.ToString() + "\")");
			}

Finally, in the page_load for !Page.IsPostBack,

				script = "<script language=JavaScript>function UncheckOthers(x){";

				for(jcount=0;jcount<jstring.Count;jcount++)
				{
					script += "if(\"" + jstring[jcount].ToString() + "\"==x){document.getElementById(\"" + jstring[jcount].ToString() + "\").checked = true;}";
					script += "else{document.getElementById(\"" + jstring[jcount].ToString() + "\").checked=false;}";
				}

				script += "}</script>";
				
				Page.RegisterStartupScript("UncheckOthers",script);

What I end up with is this:

<script language=JavaScript>
function UncheckOthers(x){
if("DataGrid1__ctl2_rdSelect"==x){document.getElementById("DataGrid1__ctl2_rdSelect").checked = true;}
else{document.getElementById("DataGrid1__ctl2_rdSelect").checked=false;}
if("DataGrid1__ctl3_rdSelect"==x){document.getElementById("DataGrid1__ctl3_rdSelect").checked = true;}
else{document.getElementById("DataGrid1__ctl3_rdSelect").checked=false;}
if("DataGrid1__ctl4_rdSelect"==x){document.getElementById("DataGrid1__ctl4_rdSelect").checked = true;}
else{document.getElementById("DataGrid1__ctl4_rdSelect").checked=false;}
if("DataGrid1__ctl5_rdSelect"==x){document.getElementById("DataGrid1__ctl5_rdSelect").checked = true;}
else{document.getElementById("DataGrid1__ctl5_rdSelect").checked=false;}
}</script>

Yes, pretty dirty, but I'm accepting this considering that there won't be more than 4 or 5 radio buttons on the grid.

Any opinions on this? Is there another way to do this?

[SeanGrebey]

Maybe I'm confused as I'm new to ASP.NET but why are you using an old HTML style Radio control (<input type = radio ...> instead of an ASP.NET radio control <asp:radiobutton ...> with the Group="MyRadioGroup" value set?

[mendhak]

It wouldn't make much of a difference in a datagrid templatecolumn, because even if I were to use <asp:radiobutton>, I'd still be able to select all of them. In other words, the GroupName attribute doesn't help in this case.