Due: Thursday, April 28, 2011
References for this assignment:
- Make copies of all your previous files and work on the copies only!
All hyperlinks should be working and pointing to the correct destination.
Include navigation on all the pages! So far your pages should be:- Hompage: Save as Homework4-A.htm
- About Us: Save as Homework4-B.htm
- Gallery or photo album: Save as Homework4-C.htm
- Credits: Save as Homework4-D.htm
- New page: Create an additional page for
your web site. This should be the Demographics page. This page should also contain
links to all the other pages on your site (i.e., Navigation).
Save this file as "Homework4-E.htm" and upload it into your HCI201 folder on students.
Contents of the Demographics page:- Text fields within a form are created with the HTML
<input type="text">tag (for text input that fits on a single line) or the HTML<textarea> </textarea>tag (for text input that requires multiple lines). You can assign names and values to both tags using the NAME and VALUE properties.This means that when a visitor types something into a text field on your page, you can query the input field by name and find out the value the visitor typed. You will need to write some JavaScript code to determine whether the visitor entered information into the required Name field or not. If he/she has not entered a name, then when the user clicks on the submit button an alert box informs the user that he/she must enter a name.
This can be accomplished by starting your form like so:
<form action="mailto:your email address" method="POST" enctype="text/plain" name="survey" onsubmit="return validate();">. Wherevalidate()is a JavaScript function that you need to write.When the form is submitted, the
validate()function is called. It returns a value of true or false. If true, then the information on the form is sent using the mailto method defined in the action attribute. If false, no mail is sent.Your from should contain five form controls:
→ 1 text field, 1 radio button, 1 pull-down box, 1 textarea, and 1 submit button. - Here is a screen shot of the completed form.
- Text fields within a form are created with the HTML
- (10pts) For overall content and organization.
- Make a copy of your old "Assignments3.htm" file. Name this copy: "Assignments4.htm" (version 4). Keep the old copy as is.
- Update the file by creating a link to all Homework 4 items, as in previous assignments.
- If you need to, improve the page layout and format (use CSS).
- Using SSH, upload "Assignments4.htm" into your HCI201 folder on students.
- Make sure you can view it in the browser by typing in the URL you will be submitting, and click on all the links on it to verify that they lead to the appropriate files!
- Use COLweb
to submit the URL to your Assignment list page. It should look like this:
→ http://students.depaul.edu/~yourlogin/HCI201/Assignments4.htm.
I must be able to view your updated website files form this page only so make sure your links are correct! Remember: Unix is case sensitive! Write down the file names above EXACTLY the way you have saved them into your students account, and do not forget the ~ in the URL. Since this is just one line, please submit it in the comment box provided by the COLweb submission system. Thank you.
Posted: 4-18-2011