Using the onLoad Event Handler

The event handler for the opining of a Web page is called onLoad. Because this handler is associated with the document object, you must place it in the <BODY> tag of the HTML file. You'll begin your work on the form by adding this event handler to the contestform.html file.

Return to your text editor with the contestform.html file open. Type onLoad="StartForm();" in the <BODY> tag of the HTML file as follows:

<BODY TEXT=WHITE BGCOLOR=TEAL onLoad="StartForm();">

Now you have to create the StartForm() function. This function will have two purposes: first, it will enter the current date into the Date field, and then it will move the cursor to the next field in the form. Because users are not expected to enter the current date themselves, this function provides a way of avoiding the Date field during data entry.

User-defined functions are usually collected together between a set of <SCRIPT> tags located in the HEAD section of the file. One user-defined function, named DateToday(), which you will now place in your contestform.html file in your text editor in the head section as shown below. The following should be typed on the line just above the </HEAD> tag, indenting where needed:

<SCRIPT>

<!---Hide from older browsers

function DateToday() {

var Today=new Date();

var ThisDay=Today.getDate();

var ThisMonth=Today.getMonth()+1;

var ThisYear=Today.getFullYear();

return ThisMonth+"/"+ThisDay+"/"+ThisYear;

}

//Stop Hiding

</SCRIPT>

This function contain JavaScript command that you are, by now, familiar with. Now you must add the function to the contestform.htm file so that it can retrieve the current date from the DateToday() function and place it in the Date field. Directly above the //Stop Hiding line, type in the following:

function StartForm() {

document.CON.FORMDATE.value=DateToday();

}

The startForm() function gets its values from the DateToday() function.

Adding the Focus() method to the StartForm() function

In the StartForm() function in your file, you need to add a command that places the cursor in the next field in the CON form, which is the field used for entering the first name of the participant. The field's name if FirstName, so the command to move the cursor to this field is:

document.CON.FirstName.focus();

Place this line directly under the document.CON.FORMDATE.value=DateToday line, pressing the enter key so that it is displayed on a blank line by itself. Make sure you don't place it below the }.