Activity: Ajax and backend PHP

(no submission)

Purpose:

• Hands-on experience with Ajax and PHP backend component

For this exercise, you may work alone or with another student in this course.

---

You will incorporate Ajax into welcome.js so that the frontend info.html displays the user's data entry asynchronously. You may create a backend component from scratch or use welcomeMsg.php (text version)

You will implement one of the following options of the JavaScript file (welcome.js).

• Option 1:
  • Using HTTP GET request without a promise object
  • Using HTTP POST request without a promise object
• Option 2:
  • Using HTTP GET request with a promise object
  • Using HTTP POST request with a promise object

Please feel free to refer to Ajax overview.

Optional: Apply the idea to your project
Reminder, if you correctly implement and incorporate AJax, interacting with at least one back-end component (i.e., PHPs) of your project, you will receive up to 5 points extra credit on the final exam.

You should consider:

• Request phase
  • How do you create an XMLHttpRequest object?
  • How do you configure XMLHttpRequest object?
  • How do you make an asynchronous request?
  • How do you send the request to the server?
• Receiver phase
  • How do you process the response from the server?
  • How do you update the HTML DOM?

---

To deploy and test your Ajax component, please refer to Basic web deployment (XAMPP and GCP)

To deploy and test your PHP program use one of the following options:

• PHP deployment (XAMPP)
• PHP deployment (GCP)

---

You may modify your interface the way you like. Get creative. Feel free to add additional elements you feel should be included and have fun!

---

Copyright © 2022 Upsorn Praphamontripong

Released under the CC-BY-NC-SA 4.0 license.

Last updated 2022-06-05 19:11