Creating a Customer Logon Using ASP, Adding a Javascript to a Form for Onload

TEC236 3/6/06

Creating a customer logon using Active Server Page (ASP), Adding a JavaScript (JS) to a form for OnLoad.

This lab uses three pages: index.html (modify), password.asp (new), faqs-small-animals.html (new)

From Last class:

Link your store.html page

Toys and Accessories to small-animal-toys.html (order form).

Create a Customer Logon Form

Open your index.html page in DW

After the buttons and before the copyright statement insert a form.

Insert > Form

Properties Settings:

Form Name: pass

Form Action: password.asp

Method: Post

Leave the other settings blank

Inside the Form ( dotted lines) add the text:

Customer Logon:

Place your cursor after the text and insert a Form Object

Insert > Form Object > Text Field

Properties Settings:

TextField: pword

Type: password

Leave the other settings blank

Place your cursor after the textfield box and hit enter to expand the form area

Insert a Form Object

Insert > Form Object > Button

Properties Settings:

Button Name: submit

Button Label: Submit

Action: Submit form

Place your cursor inside the form and next to the Submit Button

Insert a Form Object

Insert > Form Object > Button

Properties Settings:

Button Name: reset

Button Label: Clear

Action: Reset form

Save the page

Add JS onload code to the page to have cursor automanually placed into the Logon box

In the index.html page, view the code

View > Code

Add the following code directly under the </head> tag.

Code can be copied from today’s lab at

<script LANGUAGE="JavaScript">

function giveFocus()

{

document.pass.pword.focus();

}

</script>

Add: onLoad="giveFocus()" to the Body tag.

Save page

Test the page

When index.html loads the cursor should be the Text field box

Create a Customer Logon Authentication ASP page.

In DW create a blank page

File > New > Basic Page

Go to the code

View > Code

Delete all the code in the page

Add the following code to page: (can copy and paste)

if Request.Form("pword") > "pets" then

Response.AddHeader "401.1 Unauthorized: ", "401.1"

Response.Write "<H2>HTTP Error 401</H2<P<STRONG>401.1 Unauthorized: Logon Failed</STRONG</P<P>This error indicates that the credentials passed to the server do not match the credentials required to log on to the server.</P>"

Response.Write "<center<a href='index.html'>Back to Home Page</a</center>"

Response.End

else

Response.Redirect "faqs-small-animals.html"

End if

Save as password.asp

Create a Pets FAQ page

In DW open your template.html page

Delete any content in the center table if needed

Add a title to the page: Small Animal FAQ

Modify > Page Properties > Title

Save as faqs-small-animals.html

In the IE browser test the JavaScript and password (password: pets )

Enter an incorrect password and note

View source, do you see the ASP code?