HTML

Page 1 of 3

IT 3203 Project Milestone #2: HTML and Client Form

Due Date: April 19th @11:59 pm

Instruction

The summer is coming and CARIT has four student assistant positions open (not real!). In order to be

considered for such a position, a student has to complete some required courses and meet the minimum

average grade (of these required classes) requirement. See the table below.

* Note: please decide the other courses as you like (up to 4 courses).

Function/content requirements:

Continuing your work from Milestone #1, add one page for students to evaluate their eligibility to

apply for the positions. Add this page to the main menu as well.

In this new page:

1. Provide a short description of the page, purpose, and instructions. 2. Design a form for students to enter their information and get the evaluation results. Complete

the following functionalities using JavaScript.

• The student should first select his student status and the position. Depending on the information provided, different set of course titles should be presented.

• A student then should enter or select a letter grade (A, B, C, D, or F) for each course. Use appropriate form controls to accept user inputs.

• After hitting the “Evaluate” button, the result (average grade) with a message should be displayed right underneath the form.

• Use the rules of this course to convert letter grades to numeric point grades (e.g. A is 4.0, etc.).

• If the average grade requirement is met, display a congratulation message with instructions to apply; if not, thank his/her interest (make up your own text) but do not

Student status Grade

average

requirement

Position 1 Position 2

Undergraduate >3.2 1. CSE 3203 Mobile System Overview

2. IT 4213 Mobile Web Development

3. 4.

1. IT 4153 Advanced Database 2. IT 4713 BI Systems 3. 4.

Graduate >3.7 1. IT 6203 IT Design Studio 2. IT 6753 Advanced Web 3. 4.

1. IT 6713 Business Intelligence

2. IT 7113 Data Visualization 3. 4.

Page 2 of 3

show the application form link (Display a message. Application form is not required.

You can display a link too).

Style requirements

1. The new page should have the same style and layout as the site. 2. Apply some custom style to form controls, other than the default style. 3. Use a simple style, neat, clean; not too colorful and flashy. Refer to milestone #1 style

requirements.

File/code organization requirements

1. Professionally name all files. 2. You may embed JavaScript directly in the page or create a separate script file (.js). 3. The new page should also link to the CSS style file you created in milestone #1. 4. Refer to milestone #1 for other general requirements. 5. You should not use any wizard to generate JavaScript, nor should you copy scripts from other

sources.

6. All pages should work on your hosted site.

Submission

Submit the following two items to D2L:

1. Maintain a live working website for the project on your hosted site. Submit the URL (directly put in the Comments textbox).

2. A milestone report in PDF format, including: o Overview: brief description of your work, including how requirements are satisfied. o The URL to your live project (milestone #2). o Web page screenshots with explanations. Take screenshots of the new webpage

displayed in the browser, showing required effects. Clearly label and describe all

screenshots. All screens must be clear, original, and show the complete browser

window (only the top part of the page if the page is too long). No graphic editing or

cropping is allowed.

o References (styles, images, etc.) 3. Compress all project files into a .zip file.

Grading guide

Your grade is determined on:

• How much you have satisfied the requirements specified in the instruction, and your creativity.

• Web page design quality.

• Well-formed and clean code. You should not use any wizard to generate the code, nor should you copy and paste codes from other sources without cleaning it.

• Following the submission requirements.

• Report quality.

• The live site works correctly.

Page 3 of 3

Rubric

Score Summary Rating Description

25 Outstanding work;

beyond expectation.

Successfully complete all functionalities and meet all requirements.

Excellent application design and clean form design.

Well-formed and clean code; easy to read.

Excellent report with clear original screenshots and explanation.

The live site works correctly.

20-24 Good work; meet

expectations

Successfully complete all functionalities but with minor issues.

Good form design (neat and clean).

Well-formed and clean code; easy to read.

Good report with clear original screenshots.

The live site works correctly.

10-20 Adequate work;

Some functionality is buggy.

Poor form design (missing custom style)

Have some problems of organizing code; difficult to read.

Unorganized report with missing parts. No live site.

<10 Lack of effort.

Missing major contents or pages.

Poor form design (disorganized HTML and controls).

Poor coding practices.

Missing report or other required files. No live site.