Homework 7: AJAX

  • Due Sep 26, 2024 by 9:30am
  • Points 1
  • Submitting a website url
  • Available after Sep 24, 2024 at 9:30am

Watch these videos:

Update the code from class to use AJAX to check the answers. Do this as follows:

PHP:

  • create a new file named questions.php
    • move the code from the top of quizzer.php that initializes the $quiz variable over to questions.php
    • import questions.php into quizzer.php—use the require_once Links to an external site. function to handle the import
  • create a new PHP file called grade.php and import the questions.php file
  • this should process the POST parameter responses, which is a JSON array of objects, each object corresponding to a question and having the keys 'id' (the question id) and 'answer'
  • for each of those questions, check if the answer is correct or not using the $questions variable that was imported from questions.php
    • add a new field to the object called 'correct' and set it to true or false depending on whether the answer was correct
    • (note: we already do something like this at the top of quizzer.php; make sure that you update $responses and not $questions, though, because we don't want to send back the real answers in the next step)
  • at the end of the script, print/echo that array (converted to JSON—use json_encode)

JS:

  • modify the code in quizzer.js that submits the form with responses so that it uses AJAX instead
  • upon hearing back from the server, quizzer.js should go through and add the correct/incorrect classes
  • it should also update the score at the top in the format: Score: 80% (4/5)
  • (note that code to handle this existed in our older versions of quizzer.js)

Commit your files (grade.php, quizzer.js, quizzer.php, and questions.php) to your CSC302 git repository in the folder homework/hw7. Push to GitHub and submit a link to the GitHub folder to this assignment.

1727357400 09/26/2024 09:30am