Passen Sie die Iframe-Höhe jedes Mal an, wenn sich der Inhalt ändert
Posted: 13 Jan 2025, 16:19
Ich habe ähnliche Fragen wie „Breite und Höhe des Iframes anpassen, um sie an den darin enthaltenen Inhalt anzupassen“ gesehen, aber ich denke, dass meine Frage anders ist.
Ich habe eine Tabelle in einem Iframe und nur wenige Suchfelder, meine Güte Die Suche erfolgt sofort (onkeyup) und nicht, nachdem ich auf eine Schaltfläche gedrückt habe.
Mein Problem ist, dass ich den Iframe nicht jedes Mal neu laden möchte, wenn ich etwas suche, sondern nur „filtern“ möchte. den Inhalt bei der Suche nach etwas. Ich verwende Datatables für meine Tabelle, wenn es hilft
Ich habe diesen Code ausprobiert, aber er funktioniert nur, wenn ich den i-Frame neu lade. Ich möchte auch, dass die Suche sofort erfolgt und keine Schaltfläche zum Suchen hinzugefügt wird.
mein JS-Code für die Höhe des Iframes:
und das ist der Such-JS-Code:
Ich verwende auch Datentabellen für meine Tabelle.
Ich habe eine Tabelle in einem Iframe und nur wenige Suchfelder, meine Güte Die Suche erfolgt sofort (onkeyup) und nicht, nachdem ich auf eine Schaltfläche gedrückt habe.
Mein Problem ist, dass ich den Iframe nicht jedes Mal neu laden möchte, wenn ich etwas suche, sondern nur „filtern“ möchte. den Inhalt bei der Suche nach etwas. Ich verwende Datatables für meine Tabelle, wenn es hilft
Ich habe diesen Code ausprobiert, aber er funktioniert nur, wenn ich den i-Frame neu lade. Ich möchte auch, dass die Suche sofort erfolgt und keine Schaltfläche zum Suchen hinzugefügt wird.
mein JS-Code für die Höhe des Iframes:
Code: Select all
document.addEventListener('DOMContentLoaded', function() {
var iframe = document.getElementById("iframeindex");
if (iframe) {
iframe.onload = function() {
iframe.style.height = iframe.contentWindow.document.documentElement.scrollHeight + 'px';
};
}
});
Code: Select all
function applyTextFilter() {
// Volltext-Filter
const volltext = $("#volltext-filter", parent.document);
table.search(volltext.val()).draw();
// Name-Filter
const nameFilter = $("#name-filter", parent.document);
table.columns(1).search(nameFilter.val()).draw();
// Vorname-Filter
const vornameFilter = $("#vorname-filter", parent.document);
table.columns(2).search(vornameFilter.val()).draw();
// Abteilung-Filter
const abteilungFilter = $("#abteilung-filter", parent.document);
table.columns(9).search(abteilungFilter.val()).draw();
}
// Keyup-Event-Listener für alle Filter anwenden
$("#volltext-filter", parent.document).on('keyup', applyTextFilter);
$("#name-filter", parent.document).on('keyup', applyTextFilter);
$("#vorname-filter", parent.document).on('keyup', applyTextFilter);
$("#abteilung-filter", parent.document).on('keyup', applyTextFilter);
// Initiale Anwendung der Filter
applyTextFilter();