Overview

Demonstrate your knowledge of JavaScript and ColdFusion by implementing the following functionality:

Contact form

• The following validation error message should be displayed above the contact form if the user attempts to submit any empty fields. The message must appear without reloading the page.
• Style the error message to match the image above.

ColdFusion product search

• Allow the user to type in a product name (including partial product names) to search for.

• Allow the user to type in a minimum and maximum price range to search within.

• Challenge: Combine the name and price range searches into a single form with only one submit button. Allow the search to be performed if only some fields are filled in.

Tips

• You can use JavaScript to dynamically add the error message into the DOM.

• Add an id or class to the error message to allow it to be easily styled.

• Make sure the product name search is not case-sensitive by converting query data to lowercase.

• You can create each of the product searches are a separate form/page

Marking Criteria

• Contact form message appears on error, without reloading the page

• Contact form error message is in the correct position and styled appropriately

• Search returns correct results using a partial product name typed into an input

• Search returns correct results using minimum and maximum prices typed into separate inputs

• Search returns correct results using partial name, minimum and maximum prices together