0% found this document useful (0 votes)
16 views

5 textbox radiobutton checkbox in asp.net

Uploaded by

Jesica D'cruz
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
16 views

5 textbox radiobutton checkbox in asp.net

Uploaded by

Jesica D'cruz
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 8

ASP.

NET TextBox Control

The TextBox control is used to get the input from the user of the web application.

Properties of a TextBox control


1. TextMode - SingleLine, MultiLine and Password.
When you set the TextMode to MultiLine, use Rows property to control the number of lines
to display for a MultiLine TextBox.
2. Text - Use this property to set or get the Text from the TextBox.
3. MaxLength - The maximum number of characters that a user can enter.
4. ReadOnly - Set this property to true if you don't want the user to change the text in the
TextBox.
5. ToolTip - The tooltip is displayed when the mouse is over the control.
6. Columns - Use this property to specify the width of the TextBox in characters
7. Height - Set the height
8. Width - Set the width
9. AutoPostBack
By default, the TextChanged event of a TextBox control is cached in the viewstate, and is
executed when the webform is submitted through a postback by clicking the button control.
If you want to change this behaviour, and post the webform immediately when the Text is
changed, set AutoPostBack to true. Setting this property to true, will convert the cached
event into a postback event.
What is AutoPostBack?
Autopostback is the mechanism, by which the page will be posted back to the server
automatically based on some events in the web controls.
In some of the web controls, the property called auto post back, which if set to true, will send
the request to the server when an event happens in the control.

For example.

Dropdown Box (Combo box) web control has the property autopostback.
If we set the property to true, whenever user selects a different value in the combo box, an
event will be fired in the server. i.e., a request will be sent to the server.

Why we need to send a request to the server in this case?


Example 1
Consider this scenario where the web page is used for entering the user information. The
page contains two combo box controls State and Town. When user selects the state, the
appropriate towns should be filled in the town combo box which is loaded from the database.
For achieving this requirement, we can set the autopostback property of state combo box to
true. If we do that, we can handle the event in the server side and write code to populate the
town combo box with the values from the database.

Example 2

Consider a login page, which contains text fields User ID, User Name and Password fields.
User name text box will not be editable.
So the requirement will be like this, when user enters the user id and clicks tab, his name
should be displayed in the User Name text field.
For achieving this we have to make autopostback property of the user id text field to true and
handle the event in the server side, In the event handler, we have to write code to fetch the
user name from the database for the user id, which we will be getting from the user id text
box.

Events of TextBox:
TextChanged - This event is fired when the text is changed.

Methods of a TextBox:
Focus - Set input focus onto the control.
To view the properties of the TextBox, Right click on the control, and select Properties. In
the properties window, you can also find the events supported by the control.
All these properties can be set at the design time, or at runtime using code.

In the properties window the thunder symbol is used to view the events associated with
the respective server control. Below, the events of a TextBox are seen.
ASP.NET Radio Button Control

Radio Button control is used, when you 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 cannot be both.
So, if the user has first selected Male, and if tries to select Female, the initial Male
selection he made should automatically get de-selected.
Another example, would be when you want the user to select his or her favourite colour.

In short, if you want to provide the user with mutually exclusive options, then choose
a Radio Button Control.

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.

Drag and drop 2 radiobutton name them male and female and run the code.
You can select both. This should not be allowed , so we use group name property.
Select male radio button, go to properties, and give a name for GroupName property say
Gender, then select female radio button and give the GroupName property the same
Gender. Now run the code you will be allowed to select one radio button.

ASP.NET CheckBox Control


CheckBox Control is used, when you want the user to select more than one option
from the available choices. For example, the education of a person. A person can have a
graduate degree, post graduate degree and a Doctorate. In this case the user selects all the
3 checkboxes. Where as a person, may just have a graduate degree, in which case he only
selects, the graduate checkbox.

Another example, would be when you want the user to select the days of his availability.
In short, if you want to provide the user with more than one option to select from,
then choose a check box Control.

Important Properties of the CheckBox Control


Checked - This is a boolean property, that is used to check if the check box is checked or
not.
Text - This is a string property used to get or set the text associated with the check box
control
TextAlign - right or left. On which side of the check box 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 check box changes.

Methods:
Focus() - Just like TextBox, checkbox also supports, Focus() method. If you want to set the
input focus, to a specific checkbox, Call this method for that check box control.

Events:
CheckedChanged - This event is fired when the checked status of the check button control
is changed.

Set GroupName property as Gender for male,female and transgender radiobuttons for
mutually exclusive behaviour.

Fieldset and legend is used to get the look of gender and education seen in the web page.
First Set autopostback to false for textbox

HTML of the ASPX page, we used in the example

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm3.aspx.cs"


Inherits="WebApplication8.WebForm3" %>

// a word of caution, the webform name and webapplication name you are
using above should be the same as youa re using in VS

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<div style="font-family:Arial">
<br />
Name :
<asp:TextBox ID="TextBox1" runat="server" BackColor="#00CC66" Font-
Bold="True" ForeColor="White"></asp:TextBox>
<br />
<br />
<div style="font-family:Arial">
<fieldset style="width:350px">
<legend><b>Gender</b></legend>

<asp:RadioButton ID="RadioButton1"
runat="server" GroupName="Gender" Text="Male" />
<asp:RadioButton ID="RadioButton2"
runat="server" GroupName="Gender" Text="Female" />
<asp:RadioButton ID="RadioButton3"
runat="server" GroupName="Gender" Text="Transgender" />
<br />

</fieldset><br />
<br />
<br />
<div style="font-family:Arial">
<fieldset style="width:350px">
<legend><b>Education</b></legend>

<asp:CheckBox ID="CheckBox1" runat="server" Text="PhD (CS)" />


<asp:CheckBox ID="CheckBox2" runat="server" Text="MBA" />
<asp:CheckBox ID="CheckBox3" runat="server" Text="MCA" />
</fieldset><br />
<br />
<br />
<asp:Button ID="Button1" runat="server" Text="Button"
BackColor="#009900" Font-Bold="True" ForeColor="White" Height="26px"
OnClick="Button1_Click1" />
<br />
</div>
</div>

</form>
</body>
</html>
Code from the CodeBehind file
using System;
using System.Text;

namespace WebApplication8
// a word of caution the namespace name here should be the name of
the webapplication you are using in VS
{
public partial class WebForm2: System.Web.UI.Page
// a word of caution the webform name here should be the webform
name you are using in VS
{
protected void Page_Load(object sender, EventArgs e)
// Sender is the class object which has raised (or invoked) the event and EventArgs is a
//object which contains any data sent by the Sender.
{
if (!IsPostBack)
{
CheckBox2.Focus();
CheckBox1.Checked = true;
}
}

protected void TextBox1_TextChanged1(object sender, EventArgs e)


{
Response.Write(" Text Changed" + "<br/>");

// first "Text Changed" is seen as output only on button click


// set AutoPostBack to true and see the output as "Text Changed"
// without clicking the button
}

// set AutoPostBack to true and see the output


// without clicking the button

protected void RadioButton1_CheckedChanged(object sender, EventArgs e)


{
Response.Write(" Male Radio Button is Selected" + "<br/>");
}

protected void RadioButton2_CheckedChanged(object sender, EventArgs e)


{
Response.Write(" Female Radio Button is Selected" + "<br/>");
}

protected void RadioButton3_CheckedChanged(object sender, EventArgs e)


{
Response.Write(" Transgender Radio Button is Selected" + "<br/>");
}

protected void CheckBox1_CheckedChanged(object sender, EventArgs e)


{
Response.Write("PhD is Selected" + "<br/>");
}

protected void CheckBox2_CheckedChanged(object sender, EventArgs e)


{
Response.Write("MBA Selected" + "<br/>");
}

protected void CheckBox3_CheckedChanged(object sender, EventArgs e)


{
Response.Write("MCA is Selected" + "<br/>");
}

protected void Button1_Click1(object sender, EventArgs e)


{
Response.Write(" Hello " + TextBox1.Text + "<br/>");
if (RadioButton1.Checked)
{
Response.Write(" You are a " + RadioButton1.Text + "<br/>");
}
if (RadioButton2.Checked)
{
Response.Write(" You are a " + RadioButton2.Text + "<br/>");
}
if (RadioButton3.Checked)
{
Response.Write(" You are a " + RadioButton3.Text + "<br/>");
}

StringBuilder sbUserChoices = new StringBuilder();

if (CheckBox1.Checked)
{
sbUserChoices.Append(CheckBox1.Text);
}
if (CheckBox2.Checked)
{
sbUserChoices.Append(" " + CheckBox2.Text);
}
if (CheckBox3.Checked)
{
sbUserChoices.Append(" " + CheckBox3.Text);
}
Response.Write("Your Degrees : " + sbUserChoices.ToString() + " ");
}
}
}

You might also like