redesign for mulituser

change validation concept (client and server)
using entities

public/js/tab_accounts.js

@@ -1,16 +1,59 @@
-var accounts;
-$(document).ready(function(){
-    accounts = $('#accounts').DataTable({
+var accountsdata;
+
+function loadAccountsData(){
+    document.accounts.setMessage("Loading Data");
+    let status;
+    fetch("/getAccountsBalance", { method: "GET",headers: {"X-Requested-With": "XMLHttpRequest"},})
+        .then(response => {
+            status = response.statusText;
+            if (!response.ok) {
+                throw "HTTP error: " + response.status + "; " + status;
+            } else
+                return response.json();
+        })
+        .then(data => {            
+            if (document.accounts.hasRows){
+                document.accounts.data.data.splice(0,document.accounts.data.data.length);
+                document.accounts.hasRows = false;
+            }
+            document.accounts.insert({data:data.map(item => [item.description,item.amount])});
+            document.accounts.update(true);
+        })
+        .catch(err => {
+            document.accounts.setMessage(err);
+        });
+}
+
+function createDtAccounts(){
+    document.accounts = new simpleDatatables.DataTable("#accounts", {
+        searchable: false,
         paging: false,
-        searching:true,
-        scrollX:false,
-        info:false, 
-        ajax: { url: '/Ajax/getAccountsBalance', dataSrc:''},
-        layout: { topEnd: 'search' },
-//        dom: '<"toolbar">frtip',
+        data: {
+            headings: ["Konto","Betrag"],
+            data: accountsdata,
+        },
+        classes: {
+            active: "active",
+            disabled: "disabled",
+            table: "table table-striped table-sm",
+        },
         columns: [
-            { title: "Konto",orderable:false, data: "description",className:"dt-receiver" },
-            colBetrag
-            ]
+            {
+                select:0,
+                type: 'string',
+                cellClass:"dt-receiver",
+            },{
+                select:1,
+                type: 'number',
+                headerClass: "dt-amount",
+                cellClass:"dt-amount",
+                render: renderAmount
+            }
+        ]
     });
-});
+    loadAccountsData();
+}
+
+document.addEventListener("DOMContentLoaded", function(event) {
+    createDtAccounts();
+});