ROI: Search-Bar der DataTables bleibt beim horizontalen Scrollen fest angedockt

Bisher lagen Search-Feld, Length-Selector und Pagination innerhalb eines
äußeren .table-responsive-Containers und sind beim horizontalen Scrollen
mitgewandert. Jetzt übernimmt DataTables via scrollX das horizontale
Scrolling der Tabelle selbst, sodass die Bedienelemente außerhalb des
Scroll-Bereichs bleiben.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-07-03 10:59:53 +02:00
co-authored by Claude Opus 4.7
parent 786c8234ca
commit 9818f2f0db
+4 -6
View File
@@ -1132,7 +1132,6 @@ function slotsToDisplay(array $slotMap): array {
</a> </a>
</div> </div>
<div class="card-body"> <div class="card-body">
<div class="table-responsive">
<table class="table table-bordered" id="pivotTable" width="100%" cellspacing="0"> <table class="table table-bordered" id="pivotTable" width="100%" cellspacing="0">
<thead> <thead>
<tr> <tr>
@@ -1249,7 +1248,6 @@ function slotsToDisplay(array $slotMap): array {
Slots: auftragsbasiert, SIGNED (Storno gibt Slots frei und bucht auf die gleichen Zeiträume zurück). Slots: auftragsbasiert, SIGNED (Storno gibt Slots frei und bucht auf die gleichen Zeiträume zurück).
Storno-Erkennung: Rechnung mit <span class="mono">sum_net &lt; 0</span>. Storno-Erkennung: Rechnung mit <span class="mono">sum_net &lt; 0</span>.
</small> </small>
</div>
</div> </div>
</div> </div>
@@ -1258,7 +1256,6 @@ function slotsToDisplay(array $slotMap): array {
<i class="fas fa-list mr-1"></i> Debug: verarbeitete Mietpositionen <i class="fas fa-list mr-1"></i> Debug: verarbeitete Mietpositionen
</div> </div>
<div class="card-body"> <div class="card-body">
<div class="table-responsive">
<table class="table table-bordered" id="detailTable" width="100%" cellspacing="0"> <table class="table table-bordered" id="detailTable" width="100%" cellspacing="0">
<thead> <thead>
<tr> <tr>
@@ -1309,7 +1306,6 @@ function slotsToDisplay(array $slotMap): array {
Ext-Menge ist Anzahl; Umsatz extern ist anteilig berechnet. Ext-Menge ist Anzahl; Umsatz extern ist anteilig berechnet.
Menge(signed) ist für Peak/Slots relevant (Storno-Rechnung -> negativ). Menge(signed) ist für Peak/Slots relevant (Storno-Rechnung -> negativ).
</small> </small>
</div>
</div> </div>
</div> </div>
@@ -1504,8 +1500,10 @@ function openSlots(title, payload) {
} }
$(function() { $(function() {
$('#pivotTable').DataTable({ pageLength: 50, order: [[4,'desc']] }); // scrollX: DataTables kümmert sich selbst um horizontales Scrollen der Tabelle,
$('#detailTable').DataTable({ pageLength: 50, order: [[1,'desc']] }); // damit Search/Length/Pagination NICHT mit dem Scrollbalken mitwandern.
$('#pivotTable').DataTable({ pageLength: 50, order: [[4,'desc']], scrollX: true });
$('#detailTable').DataTable({ pageLength: 50, order: [[1,'desc']], scrollX: true });
$(document).on('click', '.js-hist', function() { $(document).on('click', '.js-hist', function() {
const title = $(this).data('title') || ''; const title = $(this).data('title') || '';