Introduction
Radio Button control is used,when we want the user to select only one option from the available choices.
For example,the gender of a person.A person can be "Male" or "Female".He/she cannot be both.
So,if the user has first selected "Male" and if he/she tries to select "Female",the initial "Male" selection he made should automatically get de-selected.
Another example would be when we want the user to select his /her favorite color.
In short,if we want to provide the user with mutually exclusive options,then choose a Radio Button Control in ASP.NET.
Important properties of the
radio Button Control
Checked - This is
a Boolean property, that is used to check if the button is checked or not.
Text - This is
string property used to get or set the text associated with the radio button
control.
TextAlign - Right
or Left. On which side of the radio button the text should appear.
AutoPostback –
set this property to true, if you want the webform to be posted immediately when
the checked status of the radio button changes.
Group Name – By default, the individual radio
button selections are not mutually exclusive. If you have a group of radio buttons,
and if you want the selections among the group to be mutually exclusive, then
use the same group name for all the radio button controls.
Events:
CheckedChanged - This
event is fired when the checked status of the radio button control is changed.
Using the code
When AutoPostBack property is not set,and there is CheckedChanged event associated with the
radio button then the event will be fired only when PostBack event like button click occurs.
checkedChanged is a cached event means the event will be cached in the view state of the control until the postback event happens.
And if we want to post the webform as soon as there is Check status change on Radio Button then we can assign property"AutoPostBack" property to "True".
Below code and output helps us to understand the scenario.
<body>
<form id="form1" runat="server">
<div>
<h1>Radio Button Control example in ASP.NET </h1>
<asp:Label ID="Label1" runat="server" Text="Gender"></asp:Label>
<br/>
<asp:RadioButton ID="rdbtn1" runat="server" Text="Male" AutoPostBack="True" TextAlign="Left"
GroupName="Gender" OnCheckedChanged="rdbtn1_CheckedChanged" />
<asp:RadioButton ID="rdbtn2" runat="server" Text="Female" AutoPostBack="True" TextAlign="Left"
GroupName="Gender" OnCheckedChanged="rdbtn2_CheckedChanged" />
<br/><br/>
</div>
<asp:Button ID="btnSubmit" runat="server" Text="Submit" OnClick="btnSubmit_Click" />
</form>
</body>
public partial class Radio_Button_demo : Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void btnSubmit_Click(object sender, EventArgs e)
{
if (rdbtn1.Checked)
{
Response.Write("Your Gender is" + rdbtn1.Text + "<br/>");
}
else
{
Response.Write("Your Gender is" + rdbtn2.Text + "<br/>");
}
}
protected void rdbtn1_CheckedChanged(object sender, EventArgs e)
{
Response.Write("Male radio Button Selection changed");
}
protected void rdbtn2_CheckedChanged(object sender, EventArgs e)
{
Response.Write("Female radio Button Selection changed");
}
}
Output
1.On the initial launch of the application below output is shown.
2.As soon as the "Male" Radio button is selected the CheckedChanged event of 'rdbtn1' is fired and below output is shown.
3.Suppose the 'AutoPostBack' property is set to 'False' or not set at all,then 'CheckedChanged' event is fired only onclick of 'Submit' button as button click is PostBack event and cached event fires only when there is PostBack event.Below output is shown.
Conclusion
In this article we have learnt about Radio Button control properties and events in ASP.NET.