ASP.Net is a web development platform provided by Microsoft. It is used for creating web-based applications. ASP.Net was first released in the year 2002.

The first version of ASP.Net deployed was 1.0. The most recent version of ASP.Net is version 4.6. ASP.Net is designed to work with the HTTP protocol. This is the standard protocol used across all web applications.

ASP.Net applications can also be written in a variety of .Net languages. These include C#, VB.Net and J#. In this chapter, you will see some basic fundamental of the.Net framework.

In this tutorial, you will learn-

What is ASP.Net?

ASP.Net is a framework which is used to develop a Web-based application. The basic architecture of the ASP.Net framework is as shown below.

ASP.Net - Intro, Life Cycle & Hello World Program

The architecture of the.Net framework is based on the following key components

  1. Language – A variety of languages exists for .net framework. They are VB.net and C#. These can be used to develop web applications.
  2. Library - The .NET Framework includes a set of standard class libraries. The most common library used for web applications in .net is the Web library. The web library has all the necessary components used to develop.Net web based applications.
  3. Common Language Runtime - The Common Language Infrastructure or CLI is a platform. .Net programs are executed on this platform. The CLR is used for performing key activities. Activities include Exception handling and Garbage collection.

Below are some of the key characteristics of the ASP.Net framework

  1. Code Behind Mode – This is the concept of separation of design and code. By making this separation, it becomes easier to maintain the ASP.Net application. The general file type of an ASP.Net file is aspx. Assume we have a web page called MyPage.aspx. There will be another file called MyPage.aspx.cs which would denote the code part of the page. So Visual Studio creates separate files for each web page, one for the design part and the other for the code.
  2. State Management – ASP.Net has the facility to control state management. HTTP is known as a stateless protocol. Let's take an example of a shopping cart application. Now, when a user decides what he wants to buy from the site, he will press the submit button.

    The application needs to remember the items the user choose for the purchase. This is known as remembering the state of an application at a current point in time. HTTP is a stateless protocol. When the user goes to the purchase page, HTTP will not store the information on the cart items. Additional coding needs to be done to ensure that the cart items can be carried forward to the purchase page. Such an implementation can become complex at times. But ASP.Net has the ability to do state management on your behalf. So ASP.Net has the ability to remember the cart items and pass it over to the purchase page.

  3. Caching – ASP.Net can implement the concept of Caching. This improve's the performance of the application. By caching those pages which are often requested by the user can be stored in a temporary location. These pages can be retrieved faster and better responses can be sent to the user. So caching can greatly improve the performance of an application.

ASP.Net Life cycle

When an ASP.Net application is launched, there are series of steps which are carried out. These series of steps makes up the lifecycle of the application.

Let's look at the various stages of a typical page lifecycle of an ASP.Net web Application.

ASP.Net - Intro, Life Cycle & Hello World Program

1) Application Start - The life cycle of an ASP.NET application starts when a request is made by a user. This request is to the Web server for the ASP.Net Application. This happens when the first user normally goes to the home page for the application for the first time. During this time, there is a method called Application_start which is executed by the web server. Usually in this method, all global variables are set to their default values.

2) Object creation - The next stage is the creation of the HttpContext , HttpRequest & HttpResponse by the web server. The HttpContext is just the container for the HttpRequest and HttpResponse objects. The HttpRequest object contains information about the current request, including cookies and browser information. The HttpResponse object contains the response that is sent to the client.

3) HttpApplication creation - This object is created by the web server. It is this object that is used to process each subsequent request sent to the application. For example, let's assume we have 2 web applications. One is a shopping cart application, and the other is a news website. For each application, we would have 2 HttpApplication objects created. Any further requests to each website would be processed by each HttpApplication respectively.

4) Dispose - This event is called before the application instance is destroyed. During this time, one can use this method to manually release any unmanaged resources.

5) Application End - This is the final part of the application. In this part, the application is finally unloaded from memory.

ASP.Net Page Life cycle

When an ASP.Net page is called, it goes through a particular lifecycle. This is done before the response is sent to the user. There are series of steps which are followed for the processing of an ASP.Net page.

Let's look at the various stages of the lifecycle of an ASP.Net web page.

ASP.Net - Intro, Life Cycle & Hello World Program

  1. Page Request- This is when the page is first requested from the server. When the page is requested, the server checks if it is requested for the first time. If so, then it needs to compile the page, parse the response and send it across to the user. If it is not the first time the page is requested, the cache is checked to see if the page output exists. If so, that response is sent to the user.
  2. Page Start – During this time, 2 objects, known as the Request and Response object are created. The Request object is used to hold all the information which was sent when the page was requested. The Response object is used to hold the information which is sent back to the user.
  3. Page Initialization – During this time, all the controls on a web page is initialized. So if you have any label, textbox or any other controls on the web form, they are all initialized.
  4. Page Load – This is when the page is actually loaded with all the default values. So if a textbox is supposed to have a default value, that value is loaded during the page load time.
  5. Validation – Sometimes there can be some validation set on the form. For example, there can be a validation which says that a listbox should have a certain set of values. If the condition is false, then there should be an error in loading the page.
  6. Postback event handling – This event is triggered if the same page is being loaded again. This happens in response to an earlier event. Sometimes there can be a situation that a user clicks on a submit button on the page. In this case, the same page is displayed again. In such a case, the Postback event handle is called.
  7. Page Rendering – This happens just before all the response information is sent to the user. All the information on the form is saved, and the result is sent to the user as a complete web page.
  8. Unload – Once the page output is sent to the user, there is no need to keep the ASP.net web form objects in memory. So the unloading process involves removing all unwanted objects from memory.

Hello World in ASP.Net

Let's look at an example of how we can implement a simple "hello world" application. For this, we would need to implement the below-mentioned steps.

Step 1) The first step involves the creation of a new project in Visual Studio. After launching Visual Studio, you need to choose the menu option New->Project.

ASP.Net - Intro, Life Cycle & Hello World Program

Step 2) The next step is to choose the project type as an ASP.Net Web application. Here we also need to mention the name and location of our project.

  1. In the project dialog box, you can see various options for creating different types of projects. Click the Web option on the left-hand side.
  2. When we click the Web option in the previous step, we will be able to see an option for ASP.Net Web Application. Click this option.
  3. We then give a name for the application, which in our case is DemoApplication. We also need to provide a location to store our application.
  4. Finally, we click the 'OK' button to let Visual Studio to create our project.

ASP.Net - Intro, Life Cycle & Hello World Program

Step 3) In the next screen, you have to choose the type of ASP.net web application that needs to be created. In our case, we are going to create a simple Web Form application.

  1. First, choose the project type as 'Empty'. This will ensure that we start with a basic application which is simple to understand.
  2. We choose the option "web Forms". This adds the basic folders. These are required for a basic Web Forms Application.
  3. Finally, we click the 'OK' button to allow Visual Studio to create our application.

ASP.Net - Intro, Life Cycle & Hello World Program

If the above steps are followed, you will get the below output in Visual Studio.

Output:-

ASP.Net - Intro, Life Cycle & Hello World Program

In the Solution explorer, you will be able to see the DemoApplication Solution. This solution will contain 2 project files as shown above. At the moment, one of the key files in the project is the 'Global.asax.cs'. This file contains application specific information. In this file, you would initialize all application specific variables to their default values.

Step 4) Now, it's time to add a Web Form file to the project. This is the file which will contain all the web-specific code for our project.

  • Right click on the DemoApplication project and
  • Choose Add->Web Form from the context menu.

ASP.Net - Intro, Life Cycle & Hello World Program

Step 5) In the next screen we are going to be prompted to provide a name for the web form.

  1. Give a name for the Web Form. In our case, we are giving it a name of Demo.
  2. Click the Ok button.

ASP.Net - Intro, Life Cycle & Hello World Program

Automatically Visual Studio will create the Demo Web Form and will open it in Visual Studio.

Step 6) The next step is to add the code, which will do the work of displaying "Hello World." This can be done by just adding one line of code to the Demo.aspx file.

ASP.Net - Intro, Life Cycle & Hello World Program

Code Explanation:-

  • The Response object in ASP.Net is used to send information back to the user. So in our case, we are using the method "Write" of the Response object to write the text "Hello World." The <% and %> markers are used to add ASP.net specific code.

If you follow all of the above steps and run your program in Visual Studio, you will get the following output.

Output:-

ASP.Net - Intro, Life Cycle & Hello World Program

From the output, you can clearly see that 'Hello World' was displayed in the browser.

Adding ASP.Net Controls to Web Forms

ASP.Net has the ability to add controls to a form such as textboxes and labels.

Let's look at the other controls available for Web forms and see some of their common properties.

In our example, we will create one form which will have the following functionality.

  1. The ability for the user to enter his name.
  2. An option to choose the city in which the user resides in
  3. The ability for the user to enter an option for the gender.
  4. An option to choose a course which the user wants to learn. There will be choices for both C# and ASP.Net

Let's look at each control in detail. Let's add them to build the form with the above mentioned functionality.

Step 1) The first step is to open the Forms Designer for the Demo web form. Once you do this, you will be able to drag controls from the toolbox to the Web form.

To open the Designer web form,

  • Right click the Demo.aspx file in the Solution Explorer and
  • Choose the menu option View Designer.

ASP.Net - Intro, Life Cycle & Hello World Program

Once you perform the above step, you will be able to see your Form Designer as shown below.

ASP.Net - Intro, Life Cycle & Hello World Program

Now let's start adding our controls one by one

Label Control

The label control is used to display a text or a message to the user on the form. The label control is normally used along with other controls. Common examples is wherein a label is added along with the textbox control. The label gives an indication to the user on what is expected to fill up in the textbox. Let's see how we can implement this with an example shown below. We will use a label called 'name.' This will be used in conjunction with the textbox controls, which will be added in the later section.

Step 1) The first step is to drag the 'label' control on to the Web Form from the toolbox as shown below.

ASP.Net - Intro, Life Cycle & Hello World Program

Step 2) Once the label has been added, follow the following steps.

  1. Go to the properties window by right clicking on the label control
  2. Choose the Properties menu option

ASP.Net - Intro, Life Cycle & Hello World Program

Step 3) From the properties window, change the name of the Text property to Name

ASP.Net - Intro, Life Cycle & Hello World Program

Similarly, also change the ID property value of the control to lblName. By specifying a meaningful ID to controls, it becomes easier to access them during the coding phase. This is shown below.

ASP.Net - Intro, Life Cycle & Hello World Program

One you make the above changes, you will see the following output

Output:-

ASP.Net - Intro, Life Cycle & Hello World Program

You will see that the Name label appears on the Web Form.

Textbox

A textbox is used for allowing a user to enter some text on the Web form application. Let's see how we can implement this with an example shown below. We will add one textbox to the form in which the user can enter his name.

Step 1) The first step is to drag the textbox control onto the Web Form from the toolbox as shown below

ASP.Net - Intro, Life Cycle & Hello World Program

Below is how this would look in the forms designer once the Textbox control is on the form

ASP.Net - Intro, Life Cycle & Hello World Program

Step 2) Once the Textbox has been added, you have to change the ID property.

  • Go to the properties window by right clicking on the Textbox control and
  • Choose properties then
  • Change the id property of the textbox to txtName.

ASP.Net - Intro, Life Cycle & Hello World Program

One you make the above changes, you see the following output.

Output:-

ASP.Net - Intro, Life Cycle & Hello World Program

List box

A Listbox is used to showcase a list of items on the Web form. Let's see how we can implement this with an example shown below. We will add a list box to the form to store some city locations.

Step 1) The first step is to drag the listbox control on to the Web Form from the toolbox as shown below

ASP.Net - Intro, Life Cycle & Hello World Program

Step 2) Once you drag the listbox to the form, a separate side menu will appear. In this menu choose the 'Edit Items' menu.

ASP.Net - Intro, Life Cycle & Hello World Program

Step 3) You will now be presented with a dialog box in which you can add the list items to the listbox.

  1. Click on the Add button to add a list item.
  2. Give a name for the text value of the list item – In our case Mumbai. Repeat steps 1 and 2 to add list items for Mangalore and Hyderabad.
  3. Click on the OK button

ASP.Net - Intro, Life Cycle & Hello World Program

Step 4) Go to the properties window and change the ID property value of the control to lstLocation.

ASP.Net - Intro, Life Cycle & Hello World Program

One you make the above changes, you will see the following output

Output:-

ASP.Net - Intro, Life Cycle & Hello World Program

From the output, you can clearly see that the Listboxes was added to the form.

RadioButton

A Radio button is used to showcase a list of items out of which the user can choose one. Let's see how we can implement this with an example shown below. We will add a radio button for a male/female option.

Step 1) The first step is to drag the 'radiobutton' control onto the Web Form from the toolbox. ( see image below). Make sure to add 2 radio buttons , one for the option of 'Male' and the other for 'Female.'

ASP.Net - Intro, Life Cycle & Hello World Program

Step 2) Once the Radiobutton has been added, change the 'text' property.

  • Go to the properties window by clicking on the 'Radiobutton control'.
  • Change the text property of the Radio button to 'Male'.
  • Repeat the same step to change it to 'Female.'
  • Also, change the ID properties of the respective controls to rdMale and rdFemale.

ASP.Net - Intro, Life Cycle & Hello World Program

Once you make the above changes, you will see the following output

Output:-

ASP.Net - Intro, Life Cycle & Hello World Program

From the output, you can clearly see that the radio button was added to the form

Checkbox - A checkbox is used to provide a list of options in which the user can choose multiple choices. Let's see how we can implement this with an example shown below. We will add 2 checkboxes to our Web forms. These checkboxes will provide an option to the user on whether they want to learn C# or ASP.Net.

Step 1) The first step is to drag the checkbox control onto the Web Form from the toolbox as shown below

ASP.Net - Intro, Life Cycle & Hello World Program

Step 2) Once the Checkboxes have been added, change the checkbox id property to 'chkASP'.

  • Go to the properties window by clicking on the Checkbox control.
  • Change the ID properties of the respective controls to 'chkC' and 'chkASP'.

Also, change the text property of the Checkbox control to 'C#'. Do the same for the other Checkbox control and change it to 'ASP.Net'.

  1. Change the ID property of the checkbox to 'chkASP'

ASP.Net - Intro, Life Cycle & Hello World Program

  1. Change the ID property of the checkbox to chkC

ASP.Net - Intro, Life Cycle & Hello World Program

ASP.Net - Intro, Life Cycle & Hello World Program

Once you make the above changes, you will see the following output

Output:-

ASP.Net - Intro, Life Cycle & Hello World Program

From the output, you can clearly see that the Checkboxes was added to the form.

Button

A button is used to allow the user to click on a button which would then start the processing of the form. Let's see how we can implement this with our current example as shown below. We will add a simple button called 'Submit' button. This will be used to submit all the information on the form.

Step 1) The first step is to drag the button control onto the Web Form from the toolbox as shown below

ASP.Net - Intro, Life Cycle & Hello World Program

Step 2) Once the button has been added, go to the properties window by clicking on the button control. Change the text property of the button control to Submit. Also, change the ID property of the button to 'btnSubmit'.

ASP.Net - Intro, Life Cycle & Hello World Program

One you make the above changes, you will see the following output

Output:-

ASP.Net - Intro, Life Cycle & Hello World Program

From the output, you can clearly see that the button was added to the form.

Event Handler in ASP.Net

When working with a web form, you can add events to controls. An event is something that happens when an action is performed. Probably the most common action is the clicking of a button on a form.

In web forms, you can add code to the corresponding aspx.cd file. This code can be used to perform certain actions when a button is pressed on the form. This is generally the most common event in Web Forms. Let's see how we can achieve this.

We are going to make this simple. Just add an event to the button control to display the name which was entered by the user. Let's follow the below steps to achieve this.

Step 1) First you have to double click the Button on the Web Form. This will bring up the event code for the button in Visual Studio.

ASP.Net - Intro, Life Cycle & Hello World Program

The btnSubmit_Click event is automatically added by Visual Studio, when you double click the button in the web forms designer.

Step 2) Let's now add code to the submit event to display the name textbox value and the location chosen by the user.

ASP.Net - Intro, Life Cycle & Hello World Program

Code Explanation:-

  1. The above line of code does the most simplest thing. It takes the value of the Name textbox control and sends it to the client via the Response object. So if you want to enter the string "Guru99" in the name text box , the value of txtName.Text would be 'Guru99'.
  2. The next line of code takes the selected value of the listbox via the property 'lstLocation.SelectedItem.text'. It then writes this value via the Response.Write method back to the client.
  3. Finally, we make all the controls on the form as invisible. If we don't do this , all the controls plus our response values will be displayed together.

    Normally, when a person enters all the information on the form such as the Name , location , Gender, etc. The next page shown to the user should only have the information which was not entered. The user does not want to see the Name , Gender , location controls again. But ASP.Net does not know this , and hence, by default, it will again show all the controls when the user clicks the Submit button. Hence, we need to write code to ensure all the controls are hidden so that the user just sees the desired output.

One you make the above changes, you will see the following output

Output:-

ASP.Net - Intro, Life Cycle & Hello World Program

In the Output screen, carry out the following steps

  1. Give a name of Guru99 in the name textbox
  2. Choose a location in the listbox of Bangalore
  3. Click on the Submit button

ASP.Net - Intro, Life Cycle & Hello World Program

Once you do this , you will see 'Guru99' and the location 'Bangalore' is displayed on the page.

ASP Net Session Management

The HTTP protocol on which all web applications work is a stateless protocol. By stateless, it just means that information is not retained from one request to another.

For instance, if you had a login page which has 2 textboxes, one for the name and the other for the password. When you click the Login button on that page, the application needs to ensure that the user name and password gets passed onto the next page.

In ASP.Net, this is done in a variety of ways. The first way is via a concept called ViewState. This is wherein ASP.Net automatically stores the contents of all the controls. It also ensures this is passed onto the next page. This is done via a property called the Viewstate.

It is not ideal for a developer to change anything in the view state. This is because it should be handled by ASP.Net only.

The other way is to use an object called a "Session Object." The Session object is available throughout the lifecycle of the application. You can store any number of key-value pairs in the Session object. So on any page, you can store a value in the Session object via the below line of code.

Session["Key"]=value

This stores the value in a Session object and the 'key' part is used to give the value a name. This allows the value to be retrieved at a later point in time. To retrieve a value, you can simply issue the below statement.

Session["Key"]

In our example, we are going to use the Session object to store the name entered in the name textbox field in the page. We are then going to retrieve that value and display it on the page accordingly. Let's add the below code to the Demo.aspx.cs file.

ASP.Net - Intro, Life Cycle & Hello World Program

Code Explanation:-

  1. The first line of code takes the value of the Name textbox control and stores it in the Session object. By specifying the code of Session["Name"] , we are giving the property a name called "Name." By specifying a name for the property , it becomes easier to retrieve it at a later point in time.
  2. The next line of code retrieves the stored value from the Session object. It then writes this value via the 'Response.Write' method back to the client.
  3. Finally, we make all the controls on the form as invisible. If we don't do this , all the controls plus our response values will be displayed together.

One you make the above changes, you will see the following output

Output:-

ASP.Net - Intro, Life Cycle & Hello World Program

From the output, you can see that the Session value of name was retrieved and displayed in the browser.

Summary:

  • ASP.Net is a development language used for constructing web-based applications. ASP.Net is designed to work with the standard HTTP protocol.
  • In ASP.Net, you can add the standard controls to a form such as labels, textboxes, listboxes, etc.
  • Each control can have an event associated with it. The most common event is the button click event. This is used when information needs to be submitted to the web server.
  • Session management is a way in ASP.net to ensure that information is passed over from one page to the other.
  • The view state property of a page is used to automatically pass the information of controls from one page to the other.
  • The 'Session' object is used to store and retrieve specific values within a web page.

 

YOU MIGHT LIKE: