Advice Generator

Scope of Work

Create a simple web application that will generate advice for the user. The advice will be pulled from a public API.

Deliverables

An HTML file with the scaffolding you will need is included. Make a note of the script tag in the header that brings in our AJAX library.

This has been included for this lab, but may not be in future labs. Return the completed HTML file saved as yourlastname_yourfirstname_module04lab.html

Requirements

Currently our page has a button, an empty p tag, and a non-dynamic tag with our counter. Your task is to make the request using AJAX and dynamically update this information.

https://api.adviceslip.com/

This is the API we’ll be using. You only need to use the ‘Random advice’ endpoint. Update the empty p tag with the value returned in the slip object.

You will also need to update the count of advice received. There is an id tagged span where you will do so.

Advice

You can use the jQuery $.ajax(); function to make the request. Documentation for the function is here.

The important bits here will be the url and method. You can also pass a function to the success parameter that will wait until the request returns successfully to execute.

Because this is asynchronous JavaScript, you cannot rely on the request to completely finish before the line of code below it is executed.

Remember this and it will hurt less.

Your best bet is to declare your counter outside of your request function scope, otherwise it will reset every time the function is called.

Resources

Code

Example

Burke's Advice Generator