DataTable verbessert

This commit is contained in:
aschwarz
2023-09-19 14:27:53 +02:00
parent d86dcf1dfe
commit 515f168663
159 changed files with 49065 additions and 83 deletions

View File

@ -13,16 +13,13 @@
<!-- icons in nav-->
<!-- data Table: https://datatables.net/ -->
<script src="../bootstrap/data-table/jquery.min.js"></script>
<link rel="stylesheet" href="../bootstrap/data-table/dataTables.bootstrap5.min.css"></style>
<link rel="stylesheet" href="../bootstrap/data-table/rowReorder.dataTables.min.css"></style>
<script type="text/javascript" src="../bootstrap/data-table/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="../bootstrap/data-table/dataTables.rowReorder.min.js"></script>
<script type="text/javascript" src="../bootstrap/data-table/dataTables.bootstrap5.min.js"></script>
<link rel="stylesheet" href="../bootstrap/data-table/jumistyle.css"></style>
<script src="../jquery/jquery-3.4.1.min.js"></script>
<link href="../bootstrap/data-table/datatables.min.css" rel="stylesheet"/>
<script src="../bootstrap/data-table/datatables.min.js"></script>
<script type="text/javascript" src="../bootstrap/data-table/moment.mon.js"></script>
<script type="text/javascript" src="../bootstrap/data-table/datetime-moment.js"></script>
<script src="js/all.js" crossorigin="anonymous"></script>
<script src="../jquery/jquery-3.4.1.min.js"></script>
<link rel="stylesheet" href="../bootstrap/node_modules/bootstrap-icons/font/bootstrap-icons.css">
</head>
@ -56,7 +53,7 @@
<!-- https://datatables.net/download/release -->
<table id="myTable" class="table table-striped table-bordered table-hover" >
<table id="tblDataTable" class="table table-striped table-hover table-bordered dataTable no-footer" cellpadding="0" border="0" role="grid" aria-describedby="tblDataTable_info">
<thead>
<tr>
<th>Vorname</th>
@ -92,19 +89,23 @@
</div>
</div>
</body>
<script>
$(document).ready(function(){
var table = new DataTable('#myTable', {
rowReorder: true,
pageLength: 10,
language: {
url: '//cdn.datatables.net/plug-ins/1.13.4/i18n/de-DE.json',
search: "",
lengthMenu: "_MENU_ Zeilen",
},
});
});
</script>
<script>
// Hinweise zur Sortierung nach Datum. <table Definition muss so <20>bernommen werden. Keine Leerzeichen <td>datum</td>. Datumsfelder d<>rfen nicht leer sein und vom Format stimmig sein
$(document).ready(function () {
$('#tblDataTable').DataTable({
responsive: true,
fixedHeader: true,
pageLength: 10,
order: [[1, 'asc']],
language: {
url: '//cdn.datatables.net/plug-ins/1.13.4/i18n/de-DE.json',
search: "",
lengthMenu: "_MENU_ Zeilen",
},
});
});
</script>
</html>
{/if}