HU a datatables-hez

src/WorkFlowCheck.Web/Pages/UserAndRole/UserEditPage.cshtml

@@ -5,10 +5,12 @@
 @{
     ViewData["Title"] = "Ellenőrzési pont";
     var UserId = Model.UserDTO.Id;
+    var url = Url.Page("./UserEditPage", "LoadRoles", new { id = UserId });
     var urlPost = Url.Page("./UserEditPage", "Save");
 }
 <h1>@ViewData["Title"]</h1>
 
+<input type="hidden" id="UserEditUrl" value="@url" />
 <input type="hidden" id="UserEditPostUrl" value="@urlPost" />
 
 <div class="card shadow p-4">
@@ -52,9 +54,48 @@
         </div>
     </form>
 </div>
-
+<br></br>
+<div class="card shadow p-4">
+    <table id="tbUserPage" class="table table-bordered table-hover table-sm" style="width:100%">
+        <thead class="table-primary">
+            <tr>
+                <th>ID</th>
+                <th>Role Name</th>
+            </tr>
+        </thead>
+        <tfoot class="table-light">
+            <tr>
+                <th>ID</th>
+                <th>Role Name</th>
+            </tr>
+        </tfoot>
+    </table>
+</div>
 @section Scripts {
     <script>
+        
+        console.log($('#UserEditUrl').val());
+
+        const table = new DataTable('#tbUserPage', {
+                ajax: {
+                       url: $('#UserEditUrl').val(),
+                       type: "GET",
+                       dataSrc : "data"
+                },
+                columns: [
+                    { data: "id" },
+                    { data: "roleName" }
+                ],
+                columnDefs: [
+                    {
+                        "targets": 0,
+                        "visible": false
+                    }
+                ],
+
+                processing:true,
+                language: { url: '//cdn.datatables.net/plug-ins/2.2.2/i18n/hu.json',}
+        });
 
         $("#saveUser").click(function () {
             const csrfToken = document.querySelector('meta[name="csrf-token"]').getAttribute('content');
@@ -98,7 +139,7 @@
         });
 
         $(document).ready(function () {
-            const $form = $("#userForm");
+            const $form = $("#UserForm");
 
             $form.validate({
                 errorClass: "text-danger small",