Scribd
Upload
42 views2 pages

Assignment5 Instructions

This document provides instructions for two JavaScript assignments. The first involves validating a form with JavaScript by checking for empty fields, validating the email address and number of nights fields. The second assignment converts an existing FAQs application from JavaScript to a jQuery UI Accordion widget by rewriting the HTML and JavaScript code.

Uploaded by

Balineni Venky
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
42 views2 pages

Assignment5 Instructions

This document provides instructions for two JavaScript assignments. The first involves validating a form with JavaScript by checking for empty fields, validating the email address and number of nights fields. The second assignment converts an existing FAQs application from JavaScript to a jQuery UI Accordion widget by rewriting the HTML and JavaScript code.

Uploaded by

Balineni Venky
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 2

JavaScript Programming

Assignment 5 Part 1: Use JavaScript to validate a form


In this assignment, you’ll use JavaScript to validate a reservation request form.

1. Open the starter folder attached (zipped) to this Assignment folder:


Evaluations\Assignments\Assignment 5\Assignment5-Files.zip -> reservation
Then, run the application and click the Submit Request button to see the page that’s
displayed when the form is submitted to the server.
2. In the JavaScript file, note that the ready event handler contains the declaration for a
constant named emailPattern that contains the pattern that will be used to validate the
email address.
3. Code a statement that moves the focus to the “Arrival date” text box.
4. Code an event handler for the submit event of the form. This event handler should
validate the user entries. If any of the entries are invalid, the code should cancel the
submission of the form. The validation is as follows:

A value must be entered into each text box.

The number of nights must be numeric.

The email address must match the pattern that’s provided.

Be sure to trim the entries and put them back into the controls regardless of whether
the entries are valid.
5. In index.html, change the text in the <small> tag to your name and student number.
Assignment 5 Part 2: Convert the FAQs app to an
Accordion widget
This assignment has you change the FAQs application from JavaScript and jQuery code to
a jQuery UI Accordion widget.
1. Open the starter folder attached (zipped) to this Assignment folder:
Evaluations\Assignments\Assignment 5\Assignment5-Files.zip -> faqs

2. In the HTML file, note that the link and script tags that you need for jQuery UI have
been coded for you. Then, rewrite the HTML so it’s consistent with the HTML that the
Accordion widget needs. Here’s what the jQuery UI website says about the Accordion
widget:

“The underlying HTML markup is a series of headers (h3 tags) and content divs so
the content is usable without JavaScript.”
3. In the JavaScript file, comment out everything within the ready() event handler. Then,
write the code for using the Accordion widget so all the panels can close and the
panel height is based on the content height.
4. In the CSS file, comment out everything that’s no longer needed for this application.
5. In index.html, change the text in the <small> tag to your name
and student number.

You might also like