The aim of these exercises is for you to build some simple web pages and to make sure you know how to use our systems for web development. The following tasks should be done in a plain text editor and saved as .html, .php, .css, or .js files where appropriate. You should then copy these files to DEVWEB. If you use Linux or Unix, go to the DEVWEB directory then to the 2015 directory (if you do not have a 2015 directory you will have to create one). If you put a file called ex.html in that directory you can view it in your web browser from any internet connected computer.
If you use Windows on any of the Departmental machines you will find the DEVWEB folder mapped to your Q: drive.
These exercises are worth up to 10% of the overall mark for CS 952 Database and Web Systems Development.
Please note that some of the later questions ask you to build on your solutions to earlier questions. You should therefore make sure that you save your solution to each question in separate files and that you do not overwrite your earlier solutions. For example, the solution file for question one could be named q1.html, the solution files for question 2 could be named q2.html (this will be a modified version of q1.html) and q2.php, the solution files for question 3 could be named q3.html (this will be a modified version of q1.html or q2.html) and q3.php (this will be a modified version of q2.php). The files that you create for each question should be placed in a directory or folder which you should zip and upload via Myplace.
This is an individual exercise: any copying of code (except from the lecture notes or the W3Schools website) may result in disciplinary measures. No late submissions will be accepted without medical certification, this should be provided at the earliest opportunity.
Using the following script showallparameters.php as your server action (and using the POST method), code the following form using HTML forms and check the correct data is sent to the server:
You may wish to use http://validator.w3.org/ with advanced options to make sure that your file conforms with W3 open standards.
Write a decent handler for the form in Q1 which shows the data nicely formatted back to the user.
Add code to this PHP script to send a fixed email to you whenever the form is submitted. See http://uk3.php.net/function.mail for mail manual and Google for examples.
Change this code so that the email contains the same information echoed back to the user.
Design a single table database to store the values from the form in Q1.
Create this database in phpMyAdmin on devweb2015 then update your PHP from Q2 to save into the database rather than emailing you.
Test your submissions using your form and phpMyAdmin to view the submissions.
Add code to the PHP in Q1..3 to check:
- The name is completed
- The telephone number is complete
- The e-mail is complete (you could try using regular expressions)
- One of Male or Female is selected
- At least one day is selected [tricky]
Add PHP so that if the name field is all capitals, it is changed to Title Case before storing.
Write HTML for the left-hand image on the last page.
Add CSS styling to make the page look like the right-hand image with minimal changes to the HTML (you only need add class and id statements) (NB: the band at top bottom is dark blue, rest of page has light blue background)
Create a CSS box in the middle of the page with maximum width 700 pixels and a nice water like image outside this box.
Add a horizontal navigation menu at the top of the page with sections for “accommodation”, “local information”, and “weather”.
Add two date fields to your form from Q1 for “Application Date” and “Job Start Date” then
Add an administrator interface for your database in Q3 that allows the user to view all submissions and delete rows – use phpMyAdmin to create the SQL for deletion and then copy that into PHP.
Finally add a new script (PHP page) that shows a specific row of the table nicely formatted for printing as a job application and link this into the table view (i.e. have a “print me” button link).