What you will learn
In this lesson we will learn how to create a basic web form using ASP.NET and C#.
What we will do
Here we will create a simple web form with some TextBox, Labels and Button controls and will see how we will send and retrieves the data from it.
For creating websites in ASP.NET using C# i would suggest to use visual studio as my lessons will be visual studio based. You can download it through this link.
- In your visual studio Create a new ASP.NET Empty Web Application Visual C# Project as shown in the figure below:
- Name your project, in my case i’m naming it as MyFirstBasicApp.
- Now on your project’s name which is written bold in Solution Explorer window right click and select Add new Item another window will appear, select Web Form and rename the page to what ever you want, i’m renaming it to Form.aspx as shown below:
- Now open your application in design view, the option is available at the bottom of the page as shown below :
- Now we need to add the table in our application to keep the layout proper. To create a Table select Table menu from the menu bar then click insert table. Here a screen will be displayed where you can tell the number of rows and columns as well as can define different properties of your table. For my application i am using 5 rows and 2 columns.
- Inside these rows and column i will design a simple form using Labels in first columns and TextBoxes and a button in a second column. You can add labels, Buttons and TextBox controls from toolbox of visual studio. Just Drag & Drop these controls as shown below:
- Now Double click the button control and add the following code inside its curly braces:
outputlabel.Text = "First Name : " + firstnamebox.Text+ " | Second Name : " + secondnamebox.Text + " | Email ID : " + emailidbox.Text ;
Here outputlabel is the name of my Label Control which is placed right above the verify button in my form. Its default Text property which can be invoked as outputlabel.Text. Now i have assigned this property the Text values of TextBoxes as firstnamebox.Text,secondnamebox.Text,emailidbox.Text here firstnamebox,secondnamebox and emailidbox are the IDs of my TextBox controls respectively.
- So now when i press the verify button it changes the default Text which is “Press the button below to verify” by default to the Text which i have defined at step 7.
- So now just build your project using Cntrl+Shift+B and execute it. Finally a browser will open, after filling the form when i will press the verify button it will display the out put as below :
- That’s All for now, If you find any difficulty don’t hesitate to contact me. Thanks.