JSON Parsing Demo

Description:

The following test project parses a JSON file of Presidents and their Vice Presidents. It also merges local data (images of the Presidents) with the data provided in the JSON file. It displays the results in a table (and a table within a table for the Vice Presidents). A simple search / sort function is also provided.

The JSON file is retrieved using an AJAX request and stored in a local variable. Everything is processed using only JavaScript (neither jQuery nor any other JavaScript library is utilized).

Graphics and CSS files to style the page are included along with a copy of the JSON file. The JavaScript is well documented.

Notes:

Because the data is retrieved using an AJAX request, a web server is required to make everything function. Simply opening the index.html file in your web browser will not work. A local server, such as MAMP would work well or a basic Linux server would also do the job.

The demo page can be viewed here:

JSON parse - Presidents List Demo

The files can be downloaded here:

json_parse.zip

Attribution:

The original images of the presidents were gathered from wikimedia commons, the frame and sepia tone effects were added by me. The provided JSON file is based on sample data from University College of the University of Denver, original author Michael Schwartz. The fonts are provided via Google Fonts