Introduction & Demonstration
The RadioButtonList control works like the DropDownList control but it enables a
user to select only one list item at a time. The RadioButttonList control
displays a list of radio buttons that can be arranged either horizontally or
vertically.
The page given below illustrates how we use the RadioButtonList control to
display a list of products titles.
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
Protected
Sub btnSubmit_Click(ByVal sender
As Object,
ByVal e As
EventArgs)
lblProduct.Text = rblProducts.SelectedItem.Text
End Sub
</script>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:RadioButtonList
id="rblProducts"
DataSourceID="SqlDataSource1"
DataTextField="TITLE"
DataValueField="ID"
RepeatColumns="4"
Runat="server" />
<asp:Button
id="btnSubmit"
Text="Submit"
Runat="server" OnClick="btnSubmit_Click" />
<hr />
<asp:Label
id="lblProduct"
Runat="server" />
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$
ConnectionStrings:DatabaseConnectionString1 %>"
ProviderName="<%$
ConnectionStrings:DatabaseConnectionString1.ProviderName
%>"
SelectCommand="SELECT
[ID], [TITLE] FROM [PRO_LIST]"></asp:SqlDataSource>
</div>
</form>
</body>
</html>
In above example, the radio buttons are rendered in a three-column layout. The
RadioButtonList control includes three properties that have an effect on its
layout:
-
RepeatColumns The number of columns of radio buttons to display.
- RepeatDirection The direction that the radio buttons are repeated. Possible
values are Horizontal and Vertical.
- RepeatLayout Determines whether the radio buttons are displayed in an HTML
table. Possible values are Table and Flow.
By default, the radio buttons rendered by the RadioButtonList control are
rendered in an HTML table. If we set the RepeatLayout property to the value
Flow, then the radio buttons are not rendered in a table. Even when the
RadioButtonList renders its items in Flow layout mode, we can specify multiple
columns.
HAVE A GREAT CODING!