Integrated DataTable.js in all tables.

This commit is contained in:
Christian P. MOMON 2020-10-22 01:14:53 +02:00
parent b812120a2b
commit 0d256c2e79
6 changed files with 67 additions and 45 deletions

View file

@ -17,7 +17,7 @@
<div>Nombre de catégories : <span id="categoryCount">n/a</span></div>
</div>
<table class="table_classic sortable left">
<table id="categoryList" class="table_classic left">
<thead>
<tr>
<th class="" style="width: 300px;">Nom de la catégorie</th>
@ -43,5 +43,14 @@
</tbody>
</table>
</div>
<script type="text/javascript">
$('#categoryList').DataTable(
{
paging: false,
ordering: true,
"order": [[ 0, "asc" ]],
language: dataTableFrench
});
</script>
</body>
</html>

View file

@ -16,7 +16,7 @@
<h2>Fichiers properties</h2>
<div>Nombre de fichiers : <span id="fileCount">n/a</span></div>
</div>
<table class="table_classic sortable left">
<table id="propertyFileListTable" class="table_classic sortable left">
<thead>
<tr>
<th style="width: 600px;">Nom local</th>
@ -37,7 +37,7 @@
<td id="fileListLineOwner" style="padding-top: 0; padding-bottom: 0;">
<a href="#" id="fileListLineOwnerLink">
<img id="fileListLineOwnerLogo" src="" style="width: 26px; height: 26px; padding-top:0; padding-bottom: 0; vertical-align: middle;"/>
&#160;<span id="fileListLineNameValue">n/a</span>
<span id="fileListLineNameValue">n/a</span>
</a>
</td>
<td id="fileListLineLineCount" class="td_number">n/a</td>
@ -50,5 +50,14 @@
</tbody>
</table>
</div>
<script type="text/javascript">
$('#propertyFileListTable').DataTable(
{
paging: false,
ordering: true,
"order": [[ 0, "asc" ]],
language: dataTableFrench
});
</script>
</body>
</html>

View file

@ -11,7 +11,7 @@
<script src="Chart.bundle.min.js"></script>
</head>
<body>
<div class="row center_table" style="width: 1100px;">
<div class="row center_table" style="width: 1400px;">
<div style="margin: 5px;">
<a id="" href="propertyStats.xhtml" class="button">Toutes</a>
@ -29,8 +29,8 @@
<div class="row center">
<div class="column">
<div class="left">
<div>Nombre de propriétés : <span id="generalPropertyCount">n/a</span></div>
<table class="table_classic center_table sortable">
<div class="center">Nombre de propriétés : <span id="generalPropertyCount">n/a</span></div>
<table id="mainPropertyListTable" class="table_classic center_table">
<thead>
<tr>
<th style="width: 150px;" rowspan="2">Chemin</th>
@ -61,8 +61,8 @@
<div class="column">
<div class="left">
<div>Nombre de propriétés : <span id="metricPropertyCount">n/a</span></div>
<table class="table_classic center_table sortable " style="margin-left: auto; margin-right: auto;">
<div class="center">Nombre de propriétés : <span id="metricPropertyCount">n/a</span></div>
<table id="otherPropertyListTable" class="table_classic center_table" style="margin-left: auto; margin-right: auto;">
<thead>
<tr>
<th style="width: 150px;" rowspan="2">Chemin</th>
@ -90,5 +90,21 @@
</div>
</div>
</div>
<script type="text/javascript">
$('#mainPropertyListTable').DataTable(
{
paging: false,
ordering: true,
"order": [[ 2, "desc" ]],
language: dataTableFrench
});
$('#otherPropertyListTable').DataTable(
{
paging: false,
ordering: true,
"order": [[ 2, "desc" ]],
language: dataTableFrench
});
</script>
</body>
</html>

View file

@ -11,7 +11,7 @@
<script src="Chart.bundle.min.js"></script>
</head>
<body>
<div class="center_table" style="width: 1300px;">
<div class="center_table" style="width: 1400px;">
<div class="legend right" style="float: right; margin-top: -150px;">
<div class="row">
@ -85,7 +85,7 @@
</div>
</div>
-->
<table class="center_table table_classic sortable left">
<table id="serviceListTable" class="center_table table_classic left">
<thead>
<tr>
<th class="" style="width: 200px;">Nom du service</th>
@ -102,13 +102,13 @@
</thead>
<tbody>
<tr id="serviceListLine" class="serviceListLine">
<td id="serviceListLineName">
<td id="serviceListLineName" style="padding-top: 0; padding-bottom: 0;">
<a href="#" id="serviceListLineNameLink">
<img id="serviceListLineLogo" src="" style="width: 26px; height: 26px; padding-top:0; padding-bottom: 0; vertical-align: middle;"/>
&#160;<span id="serviceListLineNameValue">n/a</span>
</a>
</td>
<td id="serviceListLineOrganization">
<td id="serviceListLineOrganization" style="padding-top: 0; padding-bottom: 0;">
<a href="#" id="serviceListLineOrganizationLink">
<img id="serviceListLineOrganizationLogo" src="" style="width: 26px; height: 26px; padding-top:0; padding-bottom: 0; vertical-align: middle;"/>
&#160;<span id="serviceListLineOrganizationValue">n/a</span>
@ -167,5 +167,14 @@
</tbody>
</table>
</div>
<script type="text/javascript">
$('#serviceListTable').DataTable(
{
paging: false,
ordering: true,
"order": [[ 2, "desc" ]],
language: dataTableFrench
});
</script>
</body>
</html>

View file

@ -72,38 +72,8 @@
{
paging: false,
ordering: true,
"order": [[ 2, "desc" ]],
language:
{
"sEmptyTable": "Aucune donnée disponible dans le tableau",
"sInfo": "Affichage de l'élément _START_ à _END_ sur _TOTAL_ éléments",
"sInfoEmpty": "Affichage de l'élément 0 à 0 sur 0 élément",
"sInfoFiltered": "(filtré à partir de _MAX_ éléments au total)",
"sInfoPostFix": "",
"sInfoThousands": ",",
"sLengthMenu": "Afficher _MENU_ éléments",
"sLoadingRecords": "Chargement...",
"sProcessing": "Traitement...",
"sSearch": "Rechercher :",
"sZeroRecords": "Aucun élément correspondant trouvé",
"oPaginate": {
"sFirst": "Premier",
"sLast": "Dernier",
"sNext": "Suivant",
"sPrevious": "Précédent"
},
"oAria": {
"sSortAscending": ": activer pour trier la colonne par ordre croissant",
"sSortDescending": ": activer pour trier la colonne par ordre décroissant"
},
"select": {
"rows": {
"_": "%d lignes sélectionnées",
"0": "Aucune ligne sélectionnée",
"1": "1 ligne sélectionnée"
}
}
}
"order": [[ 0, "asc" ]],
language: dataTableFrench
});
</script>
</body>

View file

@ -17,7 +17,7 @@
<div>Nombre de logiciels : <span id="softwareCount">n/a</span></div>
</div>
<table class="table_classic sortable left">
<table id="softwareList" class="table_classic left">
<thead>
<tr>
<th class="">Nom</th>
@ -40,5 +40,14 @@
</tbody>
</table>
</div>
<script type="text/javascript">
$('#softwareList').DataTable(
{
paging: false,
ordering: true,
"order": [[ 0, "asc" ]],
language: dataTableFrench
});
</script>
</body>
</html>