Professor Chris Sandvig MBA 597 - Introduction to Web Development Management Spring 2005

Last updated: 11/4/2003 3:58:36 PM

<% if printFile < " " then response.write("
") end if %>

Assignment 6 - Forms, Data Validation and Maintaining State

1. Calculator.asp - This calculator validates that the user has entered numeric values and does not allow division by zero.  You are welcome to use my HTML or create your own.

  1. The particular button clicked by the user determines which mathematical operation to perform.  Each button has a specific value (see the HTML source code on the sample). Use a case statement to determine which button was clicked and then perform the appropriate calculation.

  2. Check the inputs to make sure that they are numeric and send the user an appropriate message if they aren't.

  3. Positioning the error message. Sometimes we want messages to appear in a different position on the page then where our server side source code is located. For instance, we may want all of our server-side code above the table that displays the results and error messages to appear at the bottom of the page.  We can create a variable (I called mine strMessage) to hold the contents of the message until we are ready to write it out. We can then assign the message to the variable at the top of the page and use <% =strMessage %> to write it out at the bottom of the page. 

  4. Division by zero produces an ugly error message that our clients should never see. Add an If then else statement within your case statement (a particular case can have multiple line of code) to check that the user is not attempting to divide by zero, and if they do, give them an appropriate error message.

  5. Maintain the values in the textboxes between page reloads (or postback). Do this by adding the following value attritube to the textbox: 

    value="<% =strInput1 %>" 

    The previous statement assumes that you have retrieved the value entered into the textbox (using the request statement) and assigned it to a local variable named strInput1. 

2. Validate.asp  - This page validates that the user has entered values in both parts of the form.  The user is given a polite warning in red text if either value is missing.  Steps:

  1. Create a form containing a textbox for the name and three radio buttons for car models. When the submit button is pressed the form will 'postback' to itself.

  2. The first time the page is loaded it should not display warnings about missing data. We will create a "flag" to tell us if the page is posting back to itself and use this to suppress the validation the first time the page is loaded.  Create a hidden field that contains a variable named "bolPostBack" and assign it a value of "true"  (you can see this field in the source code of the example). The first time the user visits the page this variable will not have a value. We can check its value and display warning messages only if bolPostBack = "true".

  3. The empty field warnings should appear immediately below the appropriate empty field. Do this with a script block containing an If then statement similar to:
     
    If strName = "" and request.querystring("bolPostBack") then
        ...write warning...
    end if

  4. Give the user a message at the bottom of the page when all of the data is valid.  At the bottom of the page add a message similar to:
     
    If strName > "" and strModel > "" then
       ... write message...
    end if

  5. Maintain the data in the textboxes between page postbacks as you did in the previous problem.  Otherwise the user has to complete all of the fields each time the page posts back to itself. We won't worry about preserving the car selection, that is a bit more complicated.

3. Order01.asp - Use Validate.asp as a template for this page. Instead of giving the user a message when their data is valid we are going to write their information to a cookie and redirect them to the next stage of the order process. Steps:

Modify the code block that currently writes the 'success' message by:

  1. writing the user's info to cookies: 
          response.cookies("CarOrder")("strName") = strName 

  2. Redirecting the user to the next stage of the order process with a response.redirect statement:
           response.redirect "Order02.asp" 

The second page Order02.asp asks the user to select a car color. It also validates that a value was entered before redirecting to the final stage of the ordering process.  This page is very similar to Order01.asp. 

The final page Order03.asp reads the information from the cookie and puts it into a message to the user. It also displays an image of the car they have selected. 

There are nine car-color combinations (3 car models x 3 colors). You should use the images located at: http://yorktown.cbe.wwu.edu/sandvig/mis597/assignments/a06/images/accordGreen.jpg

The image names are:

AccordGreen.jpg
AccordRed.jpg
AccordSilver.jpg
OutbackGreen.jpg
OutbackRed.jpg
OutbackSilver.jpg
s2000Green.jpg
s2000Red.jpg
s2000Silver.jpg

Note that the image names are composed of the car model and color. Concatenate the car model and color directly into the image tag to specify the image, as shown here:
 
<img src="http://yorktown.cbe.wwu.edu/sandvig/mis314/assignments/a04/images/<% = strModel & strColor %>.jpg" >

Finally, provide a link back to Order01.asp.

Option: If you don't like my boring middle-aged college professor style cars you may use different car models.  You must have at least three car models in at least three colors each.

 


Submitting your assignment via email:

  1. The subject line of your email should read "MBA597 Ax YourName" where x is the assignment number.

  2. Send to .

  3. cc a copy to yourself (as a time-stamped receipt of your submission).
     
    Please check your URLs for accuracy since incorrect addresses will not be graded.