This gets almost everything done, including Paging, but not search.

views/admin/table/contents.html

@@ -1,18 +1,11 @@
 <script>
-  let page = 0;
-  let Tables = new GetJson(`/api/admin/table/{{ .Table }}/?page=${page}`);
-
-  const newPage = (new_page_num) => {
-    console.log("the function");
-    page = new_page_num;
-    new GetJson(`/api/admin/table/{{ .Table }}/?page=${page}`);
-  }
+  let thePage = new PaginateTable("/api/admin/table/{{ .Table }}/");
 </script>
 
 <blockstart>
 <h1><a href="/admin/table/">&laquo;</a> Admin {{ .Table }}</h1>
 
-<block x-data="Tables" x-effect="newPage(page)">
+<block x-data="thePage">
   <block class="horizontal">
     <button type="button"><a href="/admin/new/table/{{ .Table }}/">New</a></button>
     <button type="button" @click="page -= 1">Prev</button>
@@ -21,7 +14,13 @@
     <button type="button">Search</button>
   </block>
   <table>
-    <template x-for="item in theData">
+    <tr>
+      <th>#</th>
+      <template x-for="header in headers">
+        <th x-text="header"></th>
+      </template>
+    </tr>
+    <template x-for="item in contents">
         <tr>
           <td>
             <a x-bind:href="'/admin/table/{{ .Table }}/' + item.id + '/'">