* Umbau Rohrverzeichnis auf Ajax Table * Auslagerung der JS vom Rohrverzeichnis in eigene Datei
170 lines
4.2 KiB
JavaScript
170 lines
4.2 KiB
JavaScript
let table;
|
|
if (typeof hidesearch === "undefined") {
|
|
var hidesearch;
|
|
hidesearch = [100];
|
|
}
|
|
|
|
if (typeof cstmdom === "undefined") {
|
|
var cstmdom;
|
|
cstmdom = "flBrtip";
|
|
|
|
}
|
|
if (typeof columndefs === "undefined") {
|
|
var columndefs;
|
|
columndefs = "";
|
|
|
|
}
|
|
|
|
if (typeof columnfilter === "undefined") {
|
|
var columnfilter;
|
|
columnfilter = "";
|
|
}
|
|
|
|
if (typeof columnoptions === "undefined") {
|
|
var columnoptions;
|
|
columnoptions = "";
|
|
}
|
|
|
|
$('#filterrow th').each(function (i) {
|
|
let title = $('#datatable thead th').eq($(this).index()).text();
|
|
|
|
if (hidesearch.includes($(this).index())) {
|
|
|
|
} else if (columnfilter.includes($(this).index())) {
|
|
$(this).html('<select style="padding: 0;height: 28px;;text-align: center;" id="selectsearch" class="form-control form-control-select form-control-special" data-index="' + i + '">' + columnoptions + '</select>');
|
|
|
|
} else {
|
|
$(this).html('<input type="text" placeholder="' + title + '" class="form-control" data-index="' + i + '" value="" />');
|
|
}
|
|
});
|
|
|
|
table = $('#datatable').DataTable({
|
|
responsive: true,
|
|
"order": [[0, "desc"]],
|
|
buttons: [
|
|
{
|
|
extend: 'excelHtml5',
|
|
text: 'XLSX Export',
|
|
className: 'btn-success margina d-none d-lg-block',
|
|
exportOptions: {
|
|
columns: ['th:not(:last-child)']
|
|
}
|
|
}
|
|
], columnDefs: [
|
|
columndefs
|
|
],
|
|
"language": {
|
|
"url": "/datatables/json/german.json?v1"
|
|
},
|
|
orderCellsTop: true,
|
|
stateSave: true,
|
|
stateDuration: 60 * 60 * 24 * 30,
|
|
"initComplete": function () {
|
|
$('#datatable_filter').append('<i id="clear_cookie" class="fas fa-times clear-fa" title="Filter löschen" aria-hidden="true" ></i>');
|
|
$('#clear_cookie').click(function () {
|
|
$('#filterrow input').val('');
|
|
$('#filterrow select').val('');
|
|
table.search('').columns().search('').draw();
|
|
});
|
|
},
|
|
"dom": cstmdom,
|
|
"ajax": {
|
|
"url": requestUrl,
|
|
"type": "POST",
|
|
"data": function (d) {
|
|
},
|
|
"dataSrc": function (json) {
|
|
return json.data;
|
|
}
|
|
|
|
},
|
|
"columns": [
|
|
{
|
|
"data": {
|
|
_: "description.description",
|
|
"sort": "description.order"
|
|
},
|
|
className: "text-nowrap"
|
|
}, {
|
|
"data": {
|
|
_: "typeOption.typeOption",
|
|
"sort": "typeOption.order"
|
|
},
|
|
className: "text-center"
|
|
}, {
|
|
"data": {
|
|
_: "length.length",
|
|
"sort": "length.order"
|
|
},
|
|
className: "text-center"
|
|
}, {
|
|
"data": {
|
|
_: "networks.networks",
|
|
"sort": "networks.order"
|
|
},
|
|
className: "text-center"
|
|
}, {
|
|
"data": {
|
|
_: "startpoint.startpoint",
|
|
"sort": "startpoint.order"
|
|
},
|
|
className: ""
|
|
}
|
|
, {
|
|
"data": {
|
|
_: "endpoint.endpoint",
|
|
"sort": "endpoint.order"
|
|
},
|
|
className: "text-left"
|
|
},{
|
|
"data": {
|
|
_: "responsible.responsible",
|
|
"sort": "responsible.order"
|
|
},
|
|
className: "text-left"
|
|
}, {
|
|
"data": {
|
|
_: "state.state",
|
|
"sort": "state.order"
|
|
},
|
|
className: "text-left"
|
|
},{
|
|
"data": {
|
|
_: "edit.edit",
|
|
"sort": "edit.order"
|
|
},
|
|
className: "edit-td"
|
|
}
|
|
]
|
|
|
|
});
|
|
|
|
$('#filterrow').on('keyup', 'input', function () {
|
|
|
|
table
|
|
.column($(this).data('index'))
|
|
.search(this.value)
|
|
.draw();
|
|
|
|
});
|
|
|
|
$('#selectsearch').change(function () {
|
|
table
|
|
.column($(this).data('index'))
|
|
.search(this.value)
|
|
.draw();
|
|
|
|
|
|
});
|
|
let state = table.state.loaded();
|
|
if (state) {
|
|
table.columns().eq(0).each(function (colIdx) {
|
|
var colSearch = state.columns[colIdx].search;
|
|
|
|
if (colSearch.search) {
|
|
$('#filterrow').find("[data-index='" + colIdx + "']").val(colSearch.search);
|
|
}
|
|
});
|
|
table.draw();
|
|
}
|