Assignment3
Trent University
COIS 3420H
Assignment #3
JavaScript/jQuery can be used for validation to improve server performance, and to improve usability.
ALL JavaScript/jQuery (including the event handlers) must be in an external js file. If form validation
fails, the form should not continue with submission. You can choose the method for displaying error
messages, but it should not be an alert box. Your JavaScript/jQuery should do the following:
1. Add the following form validation for the editdetails page
a. Something is entered for item title (correctness not important)
b. If something is in the inserted order box, it must be numeric
2. Add the following form validation for the createaccount page
a. Username & List Title should have something in them
b. Validation to ensure a relatively secure password
3. Use jQuery UI to add a datepickr to the date field on the editdetails page (make sure at some point
(either in jQuery or php, the date is converted into MySQL format)
4. Use jQuery UI to add a confirmation dialog to delete user (similar to what we did in the lab)
5. On createaccount, use jQuery/AJAX to validate the username (when the text box loses focus),
making sure the username doesn’t already exist in the database. (You’ll have to create a new php
page to process the AJAX request)
6. Using jQuery UI and AJAX, to modify displaylist page so that clicking link for a completed item
uses AJAX to load the displaydetails page for that list item into a jQuery UI dialog pop-up. This
will allow the user to view the details of each completed list item without ever leaving the page.
(Note: you’ll need to modify the display details page to strip out the site wrapper (header, nav,
footer), the dialog should just display the details part of the page.)
Note: Neither of the following tasks are required for full marks on the assignment. They are strictly
optional for bonus marks if you’re interested in the challenge.
7. Bonus 1: Use jQuery UI to make the additem page a modular form that loads as a pop-up from
index, and use AJAX to submit it so that the user never leaves the index page (Note: on
submission, you’ll also need to use AJAX to refresh the list)
8. Bonus 2: Use jQuery UI to make the list on index.php sortable. (Note: the really tricky part of this
will be getting the sorted order to actually write back to the database so that the list stays in sorted
order.)
You should not be using an alert for any of your error messages
For submission, please zip the entire directory, keeping the directory structure intact, and submit on
blackboard, along with a link to the live version of the application and credentials for logging in.
Note: Proper use of developer tools can make working with JavaScript a lot less headache inducing.