Keeping Time with ASP
- Project I: A Simple Date Script
- Project II: A More Powerful Date Script
- Recap
- Advanced Projects
This chapter is from the book
This chapter is from the book
This chapter is from the book
Adding ASP code to an HTML file
Using the JavaScript Date () function
Sending information to the browser
Working with numbers, strings, and arrays
Somewhere in the Rocky Mountains last week, the head of marketing and a couple of other suits upstairs rubbed elbows with a deep-thinking guru. A couple of epiphanies later, and you're staring at an email informing you that the company's static Web site is no longer enough. It's time to build a "Dynamic Web Site."
You've been here before: a big, undefined project being dumped in your lap by people who have no idea what it is that they're asking you to do. In fact, the memo that you're looking at actually reads "Dynamic Web Suite." No matter. The solution here is to be proactive and get something dynamic on the site as quickly as possible. Meanwhile, you send out a long email with a detailed list of questions asking for clarification on what kind of dynamic Web site the suits want.
While they're pinned down, you can use the scripts in this chapter to familiarize yourself with how Active Server Pages (ASP) work and make your Web site "dynamic" well before the powers that be figure out how to dump more specific demands in your lap. Adding a date to a page is a fairly simple task. As a result, it's a nice way to get started with ASP basics, which makes this section a good tutorial for exploring ASP for the first time.
A date can play a useful role in navigation as a visual clue that information is fresh: If you publish information on a page on a daily or weekly basis, putting a current date on the page right away tells visitors that at least one piece of information on the page changes once a day.
Project I: A Simple Date Script
This script lets you add a date to a page with only three lines of code. We'll go into a lot of detail about how it works in order to expose basic ASP concepts that will be used time and again in this chapter and those that follow.
Note that the price we pay for simplicity is lack of functionality: The date that this script spits out probably isn't formatted exactly the way you'd like, which is where the next script, which produces a fancy date (hold on to your hats...) picks up next.
New Features
<% ... %> (The ASP Tag)
Any code enclosed in ASP tags will be executed on the server. Furthermore, this code will be removed from the page after it is executed.
For example, the "=" is equivalent to "print" in many languages and is used here to put the words "Hello World" into a page of HTML:
1. <HTML><HEAD><TITLE>Simple Date</TITLE></HEAD> 2. <BODY BGCOLOR="#FFFFFF" > 3. 4. <h1><% = "Hello World" %></h1> 5. </BODY></HTML>
will generate and send the following html page to the browser:
1. <HTML><HEAD><TITLE>Simple Date</TITLE></HEAD> 2. <BODY BGCOLOR="#FFFFFF" > 3. 4. <h1>Hello World</h1> 5. 6. </BODY></HTML>
Note how line 4 has changed from the source (above) to the code that is actually sent to the browser (below).
ASP vs. HTML: An ASP page is an HTML page with two elements added. First, the file name ends with the ".asp" extension, so that the web server knows that it's an ASP file. Second, the file includes some server-side code that contains instructions for tasks that the server should perform before delivering the page to the web browser. In this example, the Web server is inserting the words "Hello World" into the document. In a little bit, we'll look at putting dynamic information (a date) into what would otherwise be a static Web page. For more on the ASP model, see the introduction.
TIP
By using server-side scripting, rather than client side scripting, for Web sites that will be viewed by the general public, you can ensure that visitors to your site won't be confronted with confusing error messages often generated by client-side JavaScript.
<%@ Language=JavaScript %>
Because the default language for ASP code is often VBscript and most of the examples in this book use JavaScript, it is good practice to make JavaScript the default language in all of your scripts. This is done by adding the following line to the beginning of all of your code.
<%@ Language=JavaScript %> new Operator
The new operator is used to create a new object. 1 Both ASP and JScript contain a number of built-in objects that make it possible to perform complicated tasks easily. Objects are organized around particular areas of activity (for example, working with dates) and consist of methods that do things for us (methods are a lot like functions) and properties that contain information (numbers or strings).
The next section introduces an object used to work with dates.
Date() Object
The Date object is a JavaScript object that makes it easy to create and manipulate dates. To use the Date object, you must create a Date object using the "new" operator, for example:
date_object = new Date ();
This generates a Date object that contains the current date. Once a Date object has been created, there is a number of methods that can be used to manipulate the date contained in the object and to obtain information about the date. For example:
date_object.toString()
will return the date as a human-readable string (as opposed to the number of milliseconds since midnight on January 1, 1970).
Response.Write ( )
Response.Write() is the Write() method of the Response object. The Response object is the ASP object that manages anything that involves delivering information to the browser.
The Write() method is a lot like the "print" command used in many programming languages: It is used to write information to the HTML page that is delivered to the browser. For example:
Response.Write("<h1>Hello World</h1>");
will create a heading on the Web page that is output from your script (see Figure 1-1).
){kind=link}
Figure 1-1 A simple way of using Response.Write()
Note that the Response object is special object that is always available in ASP (you don't have to create it to use it). In contrast, a Date object must be created before it can be used.
Script 1-1date_simple.asp
1. <%@ Language=JavaScript %> 2. 3. <HTML><HEAD><TITLE>Simple Date</TITLE></HEAD> 4. <BODY BGCOLOR="#FFFFFF" > 5. 6. <% 7. date_object = new Date(); 8. Response.Write(date_object.toString()) 9. %> 10. 11. </BODY></HTML>
The Web page that is generated by this scripts looks like Figure 1-2.
){kind=link}
Figure 1-2 You thought something this simple would look good? (Try the next script)
How the script works
1. The first line sets the default scripting language to JavaScript, in case the ASP interpreter is expecting some other language.
2-5. This is standard HTML.
6. We open the ASP tag in anticipation of the code, which starts on the next line.
7. We create a Date object called date_object. By default, this contains the local time on the computer where it's running.
8. There are two things that happen on this line, which consists of two nested functions, executed from the inside out. The first function executed is: date_object.toString(). The output of this function is then passed to the Response.Write () function. Here's what happens:
First, we use the toString() method of the date object to turn the date information that's stored in date_object and turn it into a string (so called because it consists of a string, or list of human-readable numbers and letters). This generates a string such as "Sat May 22 14:22:55 PDT 1999."
This string is then handed to the Response.Write() function, which lets us add information to the HTML page that we're building. Thus, our string ("Sat May 22 14:22:55 PDT 1999") is added to the html page, so that the output of our script is:
<HTML><HEAD><TITLE>Simple Date</TITLE></HEAD> <BODY BGCOLOR="#FFFFFF" > Sat May 22 14:22:55 PDT 1999 </BODY></HTML>
9. Closes the ASP tag, which tells the ASP interpreter that there is no more server-side code to execute and that the rest of the page (lines 10–11) is regular html.