What is a TextBox control?

A TextBox control allows users to input information inside a form at runtime.

What is the need for TextBox?

A TextBox enables users to input information inside a field that the server can use to provide services.TextBox servers as a messenger in a client-server environment.

What is the syntax for TextBox in ASP.net?

The general syntax to create a TextBox in ASP.net is as follows:

What does the property BackColor do?

The property BackColor is used to change the background color of a TextBox.

How to drag and drop a TextBox in Visual Studio?

To use the drag and drop feature, the Visual Studio toolbox must be made visible, located inside the View tab. Then, the TextBox can be dragged into the web form file directly.

Table of contents

Introduction

ASP.NET WebForms Textbox

Creating TextBoxes

Using TextBox Input

FAQs

Key Takeaways

Last Updated: Mar 27, 2024

ASP.NET WebForms Textbox

Author Parth Jain

Do you think IIT Guwahati certified course can help you in your career?

Yes

Introduction

A textbox is a type of webform control that takes user input. There can be cases where a user must enter an input before the server can generate an output. A textbox is an empty area that can hold user information. This information can then be manipulated and used to return meaningful information.
We often encounter textboxes on a website. Mostly while filling a form. A form is a typical example of a textbox as it requires the user to enter their information in small boxes.
In this blog, we will witness how a textbox is created, the types of textboxes available, and how they can be used to generate results.

ASP.NET WebForms Textbox

To create a TextBox, we can either write code or use the drag and drop feature in Visual Studio.

To add a textbox using the drag and drop feature, we first need to go to the view tab and select the toolbox option.

With the toolbox now available, we need to drag and drop the TextBox into our web form file.

Upon dragging the TextBox, the code for the TextBox is automatically entered by Visual Studio, and a TextBox is visible.

The server-side asp has its own code to create a TextBox.This code is in the form of a tag which looks like this,

< asp:TextBoxID="TextBox" runat="server" ></asp:TextBox>

When the server renders this code it is treated as an HTML control and the following code is provided to the browser.

<input name="TextBox" id="TextBox" type="text">

This control or tag has the following properties-

Property Name	Property Description
AccessKey	Used to set a keyboard shortcut for the control.
TabIndex	Has the tab order of the control.
BackColor	Used to set the background color of the control.
BorderColor	Used to set the border color of the control.
BorderWidth	It is used to set the width of the border of the control.
Font	Used to set the font for the control text.
ForeColor	Sets the color of the control text.
Text	It is used to set the text shown for the control.
ToolTip	Displays the text only when the mouse is over the control.
Visible	It is used to set the visibility of control on the form.
Height	Sets the height of the control.
Width	Used to set the width of the control.
MaxLength	Used to set a maximum number of characters that can be entered in the text field.
Readonly	Used to make the control read-only.

An example syntax for the asp tag is as follows,

<asp:TextBox
    AccessKey="string"
    BackColor="color name|#ffffff"
    BorderColor="color name|#fafsfs"
    BorderStyle="NotSet|None|Dotted|Dashed|Solid|Double|Groove|Ridge|
        Inset|Outset"
    BorderWidth="size"
    Columns="integer"
    EnableViewState="True|False"
    Font-Bold="True|False"
    Font-Italic="True|False"
    Font-Size="string|Smaller|Larger|XX-Small|X-Small|Small|Medium|
        Large|X-Large|XX-Large"
    Font-Strikeout="True|False"
    Font-Underline="True|False"
    Height="size"
    ID="string"
    MaxLength="integer"
    ReadOnly="True|False"
    Rows="integer"
    Style="string"
    TabIndex="integer"
    Text="string"
    TextMode="SingleLine|MultiLine|Password"
    ToolTip="string"
    Visible="True|False"
    Width="size"
    runat="server"
/>

Creating TextBoxes

Now that we are aware of the syntax used to create a TextBox.It is time we make our very own TextBox.
The TextBoxes are of many types as they can contain passwords that need to be hidden for security purposes or accept multiple line inputs.
Here is an example code for creation of multiple TextBoxes.

<html>
<body style="height: 800px">
    <h1>Creating TextBoxes </h1>
<form runat="server">

Basic TextBox:
<asp:TextBox  runat="server" />
<br /><br />

Password TextBox:
<%--Automatically Hides entered text--%>
<asp:TextBox  TextMode="password" runat="server" />
<br /><br />
TextBox with text:
    <%--Has some text present as default--%>
<asp:TextBox  Text="Please Enter Your Name" runat="server" />
<br /><br />

Multiline TextBox:
    <%--Can take multiple line inputs--%>
<asp:TextBox  TextMode="multiline" runat="server" />
<br /><br />
TextBox with height:
    <%--Has custom height adjustments--%>
<asp:TextBox  rows="4" TextMode="multiline"
runat="server" />
<br /><br />
TextBox with width:
    <%--Has custom width adjustments--%>
<asp:TextBox  columns="40" runat="server" />
</form>
</body>
</html>

Here we used the above-discussed properties and created multiple textboxes that can support different inputs.

Output:

After entering the inputs

With this example, we have successfully created multiple textboxes.

Using TextBox Input

In the above example, we have learned how TextBoxes can be created. Now it is time we understand their usage a bit more.
Let us consider another example where we the user input two integers as input. Then, in return, the server has to provide the sum of the given integers as output.
The code for this example is given below.

<%@ Page Language="C#" AutoEventWireup="True" %>


<!DOCTYPE html>
<html>


<head>
    <title>TextBox Calculator Example</title>
    <script runat="server">
      protected void AddButton_Click(Object sender, EventArgs e)
      {
         int Answer;
         Answer = Convert.ToInt32(Val1.Text) + Convert.ToInt32(Val2.Text);
         AnswerMessage.Text = Answer.ToString();
      }
    </script>
</head>
<body>
  <form id="form" runat="server">
    <h1> A Simple Calculator </h1>
    <p>
        <asp:TextBox ID="Val1" Columns="2" MaxLength="3" Text="1" runat="server"/>
        +
        <asp:TextBox ID="Val2" Columns="2" MaxLength="3" Text="1" runat="server"/>
        =
        <asp:Label ID="AnswerMessage" runat="server"/>
    </p>
    <p>
        <asp:Button ID="AddButton" Text="Add" OnClick="AddButton_Click" runat="server"/>
    </p>
   
  </form>
</body>
</html>

In the above example code, we take the values inside the two TextBoxes and, with the help of an addition function, store the result of the value of the two added values inside a variable, then display it as output.

Output:

Let us test out the Calculator by providing test inputs.

FAQs

What is a TextBox control?
A TextBox control allows users to input information inside a form at runtime.
What is the need for TextBox?
A TextBox enables users to input information inside a field that the server can use to provide services.TextBox servers as a messenger in a client-server environment.
What is the syntax for TextBox in ASP.net?
The general syntax to create a TextBox in ASP.net is as follows:
<asp:TextBox ID=”TextBox1″ runat=”server”></asp:TextBox>
What does the property BackColor do?
The property BackColor is used to change the background color of a TextBox.
How to drag and drop a TextBox in Visual Studio?
To use the drag and drop feature, the Visual Studio toolbox must be made visible, located inside the View tab. Then, the TextBox can be dragged into the web form file directly.

Key Takeaways

In this article, we learned about the Webform TextBox in ASP.net and how it creates multiple types of TextBoxes.We also learned how TextBox could be used to provide the functionality to the user. However, this isn't enough, as there is always much more to explore and learn about this vast field of Web Development. To know more about ASP.NET and its intricacies, check out the articles on Features Of ASP Net And .Net or enroll in our highly curated Web Development course.