Assignment: Html Programming
Outcomes
• Using ajax with jQuery.
• Process JSON data.
Repository
• In gitlab, create a new project named 383-H08---FourRandomCharacters, where is your section (A, B, C, D, or E); UID is your unique ID, and FourRandomCharacters are any four random characters.
• Make the following people developers on your project
o All sections: castroa (Instructor)
o Only section A: silwals (Teaching Assistant)
o Only section B, C: wangy75 (Teaching Assistant)
o Only section D, E: yeb2 (Teaching Assistant)
• Clone the project into your web folder (public_html/cse383/).
• Copy the existing form assignment project's (Homework 07) files to this new folder (do not copy the .git/ folder).
Task
• Update the project such that it submits the data via an AJAX post.
• Upon a successful POST the application will receive JSON data which the application will then display.
API
• You will use the following API for POSTING your data.
1. url
1. URL
2. Data Sent
1. user: string
2. affiliation: string
3. comment: string
4. car: string
5. color: string
3. Result:
1. data[]
1. user
2. affiliation
3. comment
4. car
5. color
6. timestamp
2. status: "OK" or "FAIL"
3. msg: String
4. if OK, it will also contain data[]
• Note: This only responds to a POST request.
Requirements
1. Your HTML application will start with the form.
2. After validating all inputs (as you already should have done), override the submit so that it makes an jQuery/ajax POST call to the above URL.
3. Upon success and if status == ok, hide the form and display the returned data as a table.
4. Upon an error, display an error message to the user.
5. At the bottom of the page, place a button that will cause the form to be unhidden which will allow the user to enter new form data.
6. Make sure you HTML is valid, indented, and well commented
Details
1. You must place ALL javascript in an external script file.
2. You still must validate the user input via jQuery before calling submit.
3. You must check for ajax post errors. I will randomly (about 50% of the time) cause the API to return errors. If you get an error you should show an appropriate message to the user.
Format your assignment according to the following formatting requirements:
1. The answer should be typed, double spaced, using Times New Roman font (size 12), with one-inch margins on all sides.
2. The response also includes a cover page containing the title of the assignment, the student's name, the course title, and the date. The cover page is not included in the required page length.
3. Also include a reference page. The Citations and references should follow APA format. The reference page is not included in the required page length.
Attachment:- URL.rar