This is a migrated thread and some comments may be shown as answers.

Workaround for RadButton in Radio Button mode inside a template?

3 Answers 358 Views

Button

This is a migrated thread and some comments may be shown as answers.

Frank asked on 10 Nov 2011, 12:56 AM

ASP.net has had a bug with the RadioButton controls running inside of templates since 1.0. I wanted to use the RadButton as a replacement for the standard RadioButton. I have multiple Radbuttons (in Radio mode) being built by a RadListView. When the result is rendered, I get radio buttons that don't participate as if in a Group ( You can select all the radio buttons ).

Same thing happens to ASP.net RadioButtons. In the past I've hacked around this with custom RadioButton classes that handle outputting the propert ID to the client with respect the GroupName property. Also, I've done the client side javascript hack.

This is such a common hack in ASP.net I was hoping the Telerik RadButton would just work in this situation.

Here's an example of me using the Radbutton in a template:

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="CheckListInputGroupView.ascx.cs" Inherits="ProjectCold.RadTest.WebApplication.Views.CheckListInputGroupView" %>

<%@ Import Namespace="ProjectCold.RadTest.WebApplication.Model" %>

<%@ Import Namespace="Telerik.Web.UI" %>

<telerik:RadListView ID="RadListView" runat="server"

DataSource='<%#Bind("GroupItems")%>'

ItemPlaceholderID="GroupItemsHolder"

DataKeyNames="GroupItemID">

<LayoutTemplate>

<fieldset title='<%#Eval("ToolTip")%>'>

<legend><%#Eval("Caption")%></legend>

<asp:Panel ID="GroupItemsHolder" runat="server" />

</fieldset>

</LayoutTemplate>

<ItemTemplate>

<telerik:RadButton

runat="server"

GroupName='<%#Eval("FK_CheckListInputID", "InputGroup{0}")%>'

Text='<%#Eval("Text")%>'

ButtonType="ToggleButton"

ToggleType='<%# ( (CheckListInputGroup.InputGroupTypes)Eval("CheckListInputGroup.InputGroupType") == CheckListInputGroup.InputGroupTypes.Radio ? ButtonToggleType.Radio : ButtonToggleType.CheckBox) %>'

/>

</ItemTemplate>

<ItemSeparatorTemplate>

<br />

</ItemSeparatorTemplate>

</telerik:RadListView>

What's the best way to get my RadButton's to act like proper RadioButton's (mutually exclusive selection)?

Also, this is .Net 4, so I have access to the new ClientIDMode. I tried switching it to static, and using a static ID, but it caused a JSON error later when i click on a button.

3 Answers, 1 is accepted

answered on 10 Nov 2011, 08:33 PM

Kevin,
Thanks for the response. However, GroupName is not part of the HTML INPUT spec. I wouldn't expect to see it in the HTML source, nor do I. HTML INPUT's in Radio mode use their "Name" attribute to designate a 'group' of them. This is why it fails when inside of a data-bound container ( ASP.NET alters the NAME to include a unique per-template ID ).

In the case of a RadButton, it appears that Telerik is passing GroupName client side in JSON. They actually use two proprties. One is "groupName" the other is "uniqueGroupName" The problem is, "uniqueGroupName" is being formed incorrectly, it containers the naming container ID of the template item in the ListView.

Here's a link to a demo project.

Here's the JSON that shows the issues (RadButton[1 to 5] are not inside a databound container. The next 5 are in a RadListView. Notice the uniqueGroupName ans how it's broken by the ID of the RadListView.

<script type="text/javascript">

//<![CDATA[