grid.pt

<div metal:use-macro="load: ../layout-menu.pt">
 <div metal:fill-slot="head">
  <link rel="stylesheet" type="text/css" href="/static/datatables.min.css"/>
 </div>
 <div metal:fill-slot="content" i18n:domain="user">
  <h1 i18n:translate="">Users</h1>
  <table id="table-grid" class="table table-striped table-hover">
    <thead>
     <tr>
      <th i18n:translate="">ID</th>
      <th i18n:translate="">Username</th>
      <th i18n:translate="">Email</th>
      <th i18n:translate="">Status</th>
      <th i18n:translate="">Last login</th>
     </tr>
    </thead>
    <tbody>
    </tbody>
  </table>
 </div>
 <div metal:fill-slot="content-script">
  <script type="text/javascript" src="/static/datatables.min.js"></script>
  <script type="text/javascript">
   $(document).ready(function() {
       $('#table-grid').DataTable({
           ajax: '/user/grid/act',
           processing: true,
           serverSide: true,
       });
   });
  </script>
 </div>
</div>