What is VBScript?
VBScript (Visual Basic Script) is a scaled down version of Visual Basic. Visual Basic is a full blown programming language. VBScript, on the other hand, is a scripting language that can be run client- side (i.e. via your web browser), or server-side (i.e. on the web server). VBScript is the most common scripting language on websites that use ASP (Active Server Pages).
When VBScript is run on the client side, the user’s browser needs to support VBScript. When run on the sever side, the server needs to support it. In this tutorial, our VBScript examples are on the client-side, therefore, in order to get the most out of this tutorial, you should use Internet Explorer, as most other browsers don’t support VBScript.
What do I need to create VBScript?
You can create JavaScript using the same equipment you use when creating HTML. That is:
- Computer
- Text editor. For example, Notepad (for Windows), Pico (for Linux), or simpletext (Mac). You could use a VBScript editor if you like but it’s not needed. The next lesson will discuss some popular VBScript editors.
- Internet Explorer. Note: VBScript is not supported in most (if not all) other browsers – therefore., it’s recommended that you use Internet Explorer.
VBScript editors
You don’t necessarily need a special VBScript editor in order to code in VBScript – you could just use a normal text editor. However, a special VBScript editor will probably make your life easier, and enable you to code your scripts much faster.
If you’d prefer not to use a text editor, you can check out these HTML / VBScript editors:
- Text Hawk
- EditPlus
- Adobe Dreamweaver
- HTML Kit (Free)
OK, to be precise, most VBScript editors aren’t solely VBScript editors. Often, they will be HTML editors with VBScript support. This generally means that they will include syntax highlighting for VBScript (ability to recognize VBScript and color code/format it for you). It may also have a toolbar with options that are specific to VBScript. Given you will probably be coding HTML at the same time, it makes sense to have an editor with HTML support anyway.
Regardless of whether you have a HTML / VBScript editor or not, you still need to test your pages in a web browser. As mentioned previously. Internet Explorer is your best bet for this when running VBScript on the client side.
OK, so you’ve got yourself an editor? Let’s move on and learn some VBScript!
VBScript Syntax
What VBScript syntax refers to, is a set of rules that determine how the language will be written (by the programmer) and interpreted (by the browser or server).
The VBScript syntax is based on the Visual Basic (VB) syntax. VB is a full blown programming environment and VBScript is a scaled down version of VB.
You may also find the VBScript syntax similar to JavaScript in some ways. If you know JavaScript, or any other language for that matter, you will be familiar with terms such as variables, functions, statements, operators, data types, objects etc. VBScript includes these too.
Most of these will be covered throughout the rest of this tutorial. For now, we’ll start with the basics.
Basic VBScript Code
Here’s some basic VBScript that outputs some text to the browser. Again, if you know JavaScript, this will look familiar.
<script type=”text/vbscript”>
document.write(“VBScript is similar to JavaScript, but different.”)
</script>
This results in:
VBScript is similar to JavaScript, but different.
Explanation of code
- The <script> tags are actually HTML, and tell the browser to expect a script in between them. You specify the language using the type attribute. In this case, we’re using VBScript.
- The part that writer the actual text is only I line (document.write (“VBScript is similar to JavaScript, but different,”)). This is how you write text to a web page in VBScript. This is an example of using a VBScript function (also known as method).
Concatenation
When writing large blocks of text to the screen, you may need to break your code up over many lines. To ensure this doesn’t affect the output, you can use an underscore to indicated a concatenation (joining two lines together).
<script type=”text/vbscript”>
document.write(“The VBScript syntax allows you to “&_
“concatenate multiple lines together, so that they “&_
“appear joined together seamlessly”)
</script>
This results in:
The VBScript syntax allows you to concatenate multiple lines together, so that they appear joined together seamlessly
Where to Put Your Scripts?
You can place your scripts in any of the following locations:
- Between the HTML document’s head tags.
- Within the HTML document’s body (i.e. between the body tags).
- Both of the above.
VBScript Variables
A variable is a fundamental part of any programming language. Variables are best visualized as a container. This is because a variable’s purpose is to hold something – a value.
How does the variable get the value? You, as a programmer, assign the value to it. This value could be dynamically produced, depending on your program/script.
Once the variable has a value, you can use subsequent code to check its value, and do something (or not do something) depending on its value.
Some programming languages require that you declare your variable before assigning a value to it. Others (such as VBScript) make this optional. In any case, it is good practice to declare all your variables first.
Declare a VBScript Variable
VBScript variables are declared using the dim statement:
<script type=”text/vbscript”>
Dim firstName
Dim age
</script>
These variables could also have been declared on the same line, separated by a comma:
<script type=”text/vbscript”>
Dim firstName, age
</script>
Option Explicit
As mentioned, it’s good practice to declare all variables before using them. Occasionally, if you’re in a hurry, you might forget to do this. Then, one day, you might misspell the variable name and all sorts of problems could start occurring with your script.
VBScript has a way of ensuring you declare all your variables. This is done with the Option Explicit statement:
<script type=”text/vbscript”>
Option Explicit
Dim firstName
Dim age
</script>
Assign Values to your Variables
You assign value using an equals operator (equals sign).the variable name goes on the left, the value on the right.
<script type=”text/vbscript”>
Option Explicit
Dim firstName
Dim age
firstName= “Borat”
age= 25
</script>
Display your Variables
You can output the value of a variable by including it within the document.write() method.
<script type=”text/vbscript”>
Option Explicit
Dim firstName
Dim age
firstName= “Borat”
age= 25
document.write (“Firstname: “ & firstName & “</br/>”)
document.write(“Age: “ & age)
</script>
Display in Browser:
Firstname: Borat
Age: 25
VBScript Arrays
A VBScript array is a special type of variable that allows you to multiple values against a single variable.
For example, say you have shopping list that you want to store and write out to the screen. You could store these in a simple variable like this:
Item1 =”Bananas”
Item2 =”Bread”
Item3 =”Pasta”
This will work fine. But one problem with this approach is that you have to write out each variable mane whenever you need to work with it. Also, you can’t do things like, loop through all your variables. If these values were stored in an array, you could save yourself a lot of time.
What Does an Array Look Like?
Arrays van be visualized as a stack of elements. Each element has an index number (left column) and a value (right column).
Note that VBScript arrays start their numbering at zero.
Array |
|
0 | Bananas
|
1 | Bread
|
2 | pasta |
Creating Arrays in VBScript
VBScript arrays are created by first assigning an array object to a variable name…
Dim arrayName(numberOfElements)
then by assigning values to the array…
ArrayName(0) = “Array element 1”
ArrayName(1) = “Array element 2”
ArrayName(2) = “Array element 3”
So, using our prior example, we could write:
Dim shoppingList(3)
ShoppingList(0) = “Bananas”
ShoppingList(1) = “Bread”
ShoppingList(2) = “Pasta”
Accessing Array Data
You can access data in an array by referring to the name of the array and the element index number.
Display a Single Array Element
This example displays the second element of the array named shoppingList (remember that VBScript array index numbers begin at zero). In this case, the value would be Bread
document.write(shoppingList(1))
So, building on our previous example, you could use the following code to declare an array, assign values, then output the contents to the screen.
Dim shoppingList (3)
ShoppingList (0) = “Bananas”
ShoppingList (1) = “Bread”
ShoppingList (2) = “Pasta”
document.write(shoppingList(1))
This results in:
Bread
Modify the Contents of an Array
You can modify the contents of an array by specifying a value for a given index number:
ShoppingList(1) = “Wholemeal Bread”
Now, the value of the second element will be:
Wholemeal Bread
VBScript Date
To display the date using VBScript, you use the VBScript dare() function.
Date()
VBScript Date Code
To display this to the user, you need to output it like you would anything else – for example, using the document.write() method.
Document.write(date())
Or even better, you could put the date into a variable first, then output the variable:
LocalDate = date()
document.write(localDate)
Both these result in:
4/7/2010
Note: If this is blank, your browser probably doesn’t support VBScript. Try using Internet Explorer.
VBScript Date Format
Your can use the VBScript FormatDate Time() method to format the date to either a long date format or a short date format.
The FormatDate Time() method accepts two arguments: The date being formatted, and the required format (indicated by a constant). The formats are specified as follows:
- 0 – This represents the default date format (as in the previous example)
- 1 – This represents the long date format (based on the user’s regional settings)
- 2 – This represents the short date format (based on the user’s regional settings)
Long Format
To use long date format, you pass the FormatDate Time() an argument of 1.
localDate = FormatDate Time(date(),1)
document.write(localDate)
This results in:
Wednesday, April 01, 2010
Short Format
To use long date format, you pass the FormatDate Time() an argument of.2.
LocalDate = FormatDate Time (date (), 1)
document.write(localDate)
This results in:
4/7/2010
VBScript If Statements
VBScript If statements are a handy tool for any VBScript programmer. In fact, If statements are a universal to all programming languages (that I’m aware of).
An If Statements allows you to tell your program to do something only if a condition is true.
For example, you might have a website that asks the user what color their hair is. You could write code that only executes if their is say, blank. OK, that’s a pretty lame example but you get the idea!
Example If Statement
In this example, we’ll stick with the lame subject of hair color, but to keep it simple, we won’t ask for user input, we’ll just set a variable with a hair color values.
<script type=”text/vbscript”>
Dim hairColor
hairColor = “Black”
If hairColor = “Black” Then
document.write(“Same color as my cat!”)
End If
</script>
This results in:
Same color as my cat!
If Else Statement
An If Else statement is an extension to the If statement. This allows you to tell the program to do something else in the event that the condition is not true.
<script type=”text/vbscript”>
Dim hairColor
hairColor = “Black”
If hairColor = “Black” Then
document.write(“Same color as my cat!”)
Else
document.write(“Oh well, whatever…”)
End If
</script>
This time the value of hairColor is blue. Because it is not blank, the Else part of the statement is executed.
This results in:
Oh well, whatever…
Elseif Statement
You can add an Elseif to test for another condition if you like. You could do as many of these as you like too.
<script type=”text/vbscript”>
Dim hairColor
hairColor = “Black”
If hairColor = “Black” Then
document.write(“Same color as my cat!”)
Elseif hairColor =”Blue” Then
document.write(“sane color as my parrot!”)
Else
document.write(“Oh well, whatever…”)
End If
</script>
This time the ‘Elseif’ code is executed because the value of the hairColor variable is blue.
This results in:
Same color as my parrot