Displaying a table in Ajax

In this task, we will display data in a tabular format using Ajax. As a data source, we will use a predefined JSON object.

Getting ready

First of all, we will need to prepare a dummy JSON data source with all the items that will be displayed in our table:

json/requests.json:
[{
  "id": "1",
  "name": "Milan Sedliak Group", 
  "workflow": "Front End Q Evaluation",
  "user": "Milan Sedliak",
  "requestor": "Milan Sedliak",
  "status": "submitted",
  "email": "[e-mail]",
  "date": "Today 15:30"
},
{...}]

How to do it...

1. As base HTML, we can use this source with a container for the table and toolbar. This toolbar will include selecting functionality for our items.

   <div class="tableContainer">
       <div class="tableToolbar">
         Select 
           <a href="#" class="selectAll">All</a>, 
           <a href="#" class="selectNone">None</a>, 
           <a href="#" class="selectInverse">Inverse</a>
       </div>
       ...