JavaScript Validation Instructions

This assignment has 4 parts:

1.     Obtaining the new script: Download and save the attached comment CGI mailer script form-mail2.pl to your server’s cgi-bin directory, and change the permissions on the script to make it executable (not writable). You need not know how it works complete the next step; however, as a Perl CGI script you may be interested in seeing what it does.

2.     Setting up the form page: In this part, you will create a form interface to the CGI program that will accept comments on your web site, as well as some information about the sender and send them to you via email. Create the form interface in a file called mailer.html. The form should include some brief instructions and a request for comments. Include the following input elements:

·      The form used for gathering the input has a NAME parameter set to usercomments.

·      The form uses the POST method and references the script called form-mail2.pl on your server for the action.

·      The form includes some brief instructions and a request for comments.

·      The form includes the following input elements:

·      A text box, called realname for the person’s name.

·      A text box, called email for the person’s email address.

·      A text area called message for the comments. Make this a bit larger than the default size.

·      A group of at least 3 radio buttons called rating with a rating scale of your choosing for your web site.

·      A text box called phone for the person’s phone number.

·      A text box called bday for the person’s birthday.

Make sure that the input elements are organized in a clear and usable fashion, and make sure that the function of each input element is clearly identified.

3.     JavaScript validation: In this part, you will add JavaScript validation to the fields on the form. You can base your validation routines on any form validation on the Internet. There is a lot out there already written and there is no need to reinvent the wheel. However, make sure you give credit. The following validations should be checked both when the value of the field changes (onChange) and before the form can be submitted (onSubmit). If a field does not validate, an appropriate message should be displayed on the webpage (not in an alert), and the focus and select should be set to the offending field.

·      realname (must be non-blank, must begin with a capital letter, and must contain at least one vowel and one consonant)

·      email (email format: [email protected])

·      message (must be non-blank)

·      phone (telephone format: (###) ###-#### ), but do not allow extra parentheses, spaces, or dashes within the phone number.

·      bday (date format: MM/DD/YY)

4.     Adding a SSI footer: In this part, you will add a header, using SSI (server side includes), to the mailer page.  Re-name your mailer.html file to mailer.shtml, so that the server will check for includes.  Include any previous HTML file at the TOP of your file (See http://httpd.apache.org/docs/2.2/howto/ssi.html if you are unsure how to do this).  Include an SSI command to display the “last modified” date of the mailer.html file.

To submit this assignment, put your name and a link to your web application in an html page and upload it to BlackBoard.