VBScript, when used to program ASP converts it to server side scripting. Any given web page could be created from a combination of server side and client side scripting. The confusing part is this: You must use these client side scripting languages (Javascript, VBScript, etc) to program in ASP!
Below we have a simple ASP script programmed in VBScript and includes the necessary HTML as well. This is only server-side scripting.
Server Side ASP Code using VBScript:
<html> <body>
<%
Dim myString myString = Date() Response.Write("The date is: " & myString)
%>
</body> </html>
Display: The date is: 10/26/2013
If you already know VBScript or Visual Basic programming then you'll recognize Dim as Dimension, which is used to "dimension" variables. It is a good programming practice to "dimension" all your variables before you use them, as we did with myString in the above example.
Now that we have our ASP Code working, say that we wanted to use our ASP code along with some client side Javascript code. To keep it simple we are just going to use the Javascript write function and have our ASP Code fill in the Date. All the Javascript client code is in the default color, but ASP Server Side Code is in Red.
ASP Code with VBScript and Client Side Javascript Code:<script>
document.write("The date is:<%
Dim myString
myString = Date()
Response.Write(myString)
%>")
</script>
Just how HTML uses tags to create web pages, ASP needs tags to create dynamic web sites. These tags do not resemble the typical tags used in HTML, so be sure you notice the difference between tags used for ASP and tags used for HTML. Below is the ASP script we used in the previous lesson.
These special tags <% and %> will always encapsulate your ASP code. Some things about the ASP tag that sets it apart from normal HTML tags: An opening ASP tag is <% while an HTML tag normally looks like <tagname> A closing ASP tag looks like %> while an HTML tag normally looks like </tagname> ASP code can occurr anywhere, even within an HTML tag opening tag like this:
I'm sure that many of you reading this have already dealt with forms before. This section is intended as a refresher course to make sure we are all on the same page when we get into processing the forms in the next section.
If you are a forms master then, by all means, go ahead and skip on to the Request.Form: Getting the Info section. If you have never worked with forms before in your life then I would suggest reviewing the tutorial So, You Want a Form, Huh? before going on to the next section.
For everyone else, here we go ...
There are several different basic form elements. We are just going to run through them one by one. I'll give you the HTML to create them and then a brief explanation of the code. That should be enough to jog your memory. Keep in mind, though, this is just a basics refresher and there are more attributes to the form elements than we will cover here.
1) The Text Box :
Here's the code:
<INPUT TYPE="text" NAME="T1" SIZE="20">
All of your form elements start with the word INPUT. This let's the browser know we are wanting a Text Box.
Second is the TYPE attribute. This defines the type of Text Box form element we are using which, in this case is "text" for plain text.
Next is the NAME attribute. This attribute gives each form element its own unique name. It is very important that each element have a unique name otherwise you won't be able to get the user's input back from the form. You will find this attribute a part of every form element.
Lastly, we get to the SIZE attribute. This simply defines the length of the Text Box.
2) The Password Text Box :
Here's the code:
<INPUT TYPE="password" NAME="T1" SIZE="20">
You'll notice it's exactly the same as the Text Box above except TYPE is set to "password" instead of "text". Using "password" tells the browser to mask anything typed into the Text Box.
3) The Text Area :
Here's the code:
<TEXTAREA ROWS="3" NAME="S1" COLS="20">
This is a Text Box on Steroids.</TEXTAREA>
Here is your beefed up Text Box also known as Text Area. This is ideal for occasions when you need a user to enter a lot of text. It has basically the same attributes as the Text Box but with some notable additions/changes.
First is the ROWS attribute. I'm sure you had figured out that this defines the number of lines displayed. You can type as much as you like, however, you will only see 3 lines of text at a time.
Second, you'll notice the COLS attribute. This is exactly the same as SIZE in the Text Boxexample above. Don't ask me why they chose to use two different names for essentially the same attribute.
Lastly, you'll notice this element is defined as TEXTAREA with a begin and end tag. Between the begin and end tag is where you can put any default value that you want to appear in theText Area.
This is also known as the Drop Down Menu. This element is defined by SELECT.
You'll also notice there is an end SELECT tag as well. In between these two tags is where you will define the different options that are available within the Drop Down List. To define an option you use the OPTION tag. You can list as many options as you like, just be sure each option is defined with both and begin and end OPTION tag.
Lastly, don't forget to end your SELECT element with an end select tag, </SELECT>.
5) The Radio Button:
Here is the code:
<INPUT TYPE="radio" VALUE="V1"
CHECKED NAME="R1">
You'll first notice that we are back to the INPUT element. In this case, our TYPE is "radio" to define the Radio Button.
The new attribute here is the VALUE. This defines the value of your radio button. Each Radio Button should have its own unique value (within the group name, that is) in order to process your form later.
Next you will see CHECKED. This tells the browser that this element is the default element. Use this on only one element in a group to define it as the default option. By default, one button must be selected. If you don't designate a default button, the browser will designate one for you.
And now we will revisit the NAME attribute. It serves a little bit different role with the radio buttons. In this case, the name should not necessarily be a unique value. For the purposes of a set of radio buttons, the NAME defines the group of buttons and the VALUE defines the value attached to each individual button. So, if you wanted the user to make a single choice from 3 different options you would give each Radio Button a unique VALUE but they would all have the same NAME.
6) The Check Box :
Here's the code:
<INPUT TYPE="checkbox" NAME="C3"
VALUE="ON" CHECKED>
And yet another INPUT. This time the TYPE is "checkbox" which defines it as a Check Box. Unlike radio buttons, check boxes are not intended to be grouped. The idea behind the Check Box is that you should be able to select as many as you like. Therefore, the NAME should be a unique one.
Like the Radio Button, the Check Box does have a VALUE attribute. This can simply store a value that tells you it was checked (we used "ON" in the example above) or it could actually store a special value like an ID number.
Lastly, there is the CHECKED attribute. It marks any the Check Box as selected by default.
7) The Submit Button :
Here's the code:
<INPUT TYPE="submit" VALUE="Submit" NAME="B1">
This time our TYPE is "submit". This defines the element as a submit button. This button will inherently trigger the form to process when pushed.
It also has a VALUE which serves a bit different purpose than on most other form elements. On a button, the value indicates what will appear on the button
What Is ASP?
ASP is an acronym for Microsoft's Active Server Pages. Now, ASP may seem like a bit of an odd name but, believe it or not, some real thought went into coming up with the name.
The reason that Microsoft named the technology Active Server Pages is because it very basically describes what the technology is all about. The Active refers to the fact that the HTML is created dynamically by your ASP pages.
The Server refers to the fact that this process is done on the server-side and not the client-side. An example of a client-side technology would be JavaScript which is a language that actually runs in the browser. Server-side technologies like ASP run on the server and send out simple HTML to the browser.
Then there is Pages. I don't think this one needs any explaining. ASP is referred to as a server technology.
How Can I Use ASP?
There are probably a million and one uses that you could come up with for ASP. ASP is great for creating almost any kind of dynamic web content from discussion groups to shopping carts. Here are some examples of common ASP applications:
Personal uses:
A randomized thought of the day on your home page.
A dynamically generated calendar of events for your kids.
A web based movie exchange application for you and your friends.
A guestbook form that stores your guests' information in a database.