HTML таблица асинхронных и загрузчик страниц

Question

Как поставить какой-нибудь gif или загрузчик, когда моя таблица загружается из моей БД. Я просто хочу включить функцию загрузки или отключить мою таблицу во время загрузки.

Вот моя текущая таблица, которая выбирает 5k строк:

<table width="100%" height="100%" class="table table-striped table-bordered table-hover" id="dataTables-example">
    <thead>
        <tr>
            <th>ID</th>
            <th>Name</th>
            <th>Employee Class</th>
            <th>Job Category</th>
            <th>Hire Date</th>
            <th>Compensation Grade</th>
            <th>Job</th>
            <th>Status</th>
            <th>Personal Details</th>
            <th>Managers Details</th>

        </tr>
    </thead>
    <tbody>
        {% for employee in employees %}
        <tr class="odd gradeX">
            <td>{{employee.empID}}</td>
            <td>{{employee.name}}</td>                                     
            <td>{{employee.empClass}}</td>
            <td>{{employee.jobCat}}</td>
            <td>{{employee.hireDate}}</td>
            <td>{{employee.compGrade}}</td>
            <td>{{employee.job}}</td>
            <td>{{employee.empStatus}}</td>
            <td>
                 <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal">Show</button>
            </td>  
             <td>
                 <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal">Show</button>
            </td>                                                                        
        </tr>
        {% endfor %}
</table>

Любые предложения или комментарии. ТИА