Okay, so I think we are through with our tour of the various controls available in asp.net. What we are going to do now is take a closer look at the html controls that we looked at the beginning. So, let us just close the website that we have at the moment, close solution. I am not going to bother saving the example. We did not really have anything too compelling so let us just click on No there and let us create a new website. File, New, Website. Okay, I am going to call this website html controls demo. There is our familiar basic starting point. Let us just make the toolbox to make it smaller to get a bit more realistic on the screen. And also, because we are going to be using the html controls, let us just close or minimize the standard top and let us just concentrate on html tab here.
So let us just have a quick summary of what we already know. Remember, this is our first webpage on the basic html tabs such as html. And it has a title and it has a body. Inside the body, we have a form and we have this runat=server attribute. I still have not really explained properly but I am going to later on in this lesson. And then within the form, we have a div and the div gives us a place where we can put all our various controls. So, that is the basic starting point. But then if you notice that at the bottom of Visual Studio, we have a trail, a collection of tags. It is quite handy and lets you focus on eight particular controls on the webpage and it is quite useful if you want to select one of the non visual controls or one of the controls that contains other elements. We will see how to do this later by selecting html table. So, for example I click on form, I like to select the tag and it selects the whole tag up here appear or alternatively, I could click on form and select the tag content and it just selects the internal part of the form but without the start tag or the end tag.
Okay, so let us add some controls to our html page. Let us just sit back into design mode. One of the things you often want to do in a webpage is to control the layout of your text fields and the buttons and labels so that they appear vertically aligned. As we saw in the first lesson, there is no easy way to control the alignment of controls on your webpage. So the approach most people take is to use an html table. So, let us add an html table on to our page. I am just going to make it a little bit bigger. Just drag it a little bit there and I think it deepens up as it stands. So, this is an html table, we can add more columns or rows. We can delete columns or rows very easily. So for example, I can insert a column to the right and I am going to do that again. We are going to need five columns in this example so let us insert another column to the right. We currently have five columns. If I want to, I can make the various columns bigger. I will just drag them out there or smaller. Let us make the middle column smaller. That is just going to be a separator in our example.
Okay, very good. Now, what we are going to do is we are going to add some basic text on the textboxes and lists and two checkboxes and the button. So, all of these, we are going to use the basic html tags initially and see what level of functionality we have. Then later on, we are going to create another application called Web Controls demo and we will see how to use the web controls on the standard tab and we will see how much easier that is. So first things first, let us just type in some static text in the first cell. This is where the user is going to enter their name. So, let us just type in name and okay. Then in the second cell, I am going to drag a textbox so that will be an input text control. Let us drag that over there. You often have to just to play around with the html table to make it look just right. But it is easy to do.
Okay, so there is my text control. Just come down to the properties here. Let us have a look at the various properties available. Now bear in mind that this is a simple input text control as suppose to one of those functional asp.net textbox classes. It is no su
Transcription by:
Scribe4you Transcription Services