Programmiererforum

document.addEventListener('DOMContentLoaded', function() {

var iframe = document.getElementById("iframeindex");

if (iframe) {
iframe.onload = function() {
iframe.style.height = iframe.contentWindow.document.documentElement.scrollHeight + 'px';
};
}
});

    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();

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:
[code]document.addEventListener('DOMContentLoaded', function() {

var iframe = document.getElementById("iframeindex");

if (iframe) {
iframe.onload = function() {
iframe.style.height = iframe.contentWindow.document.documentElement.scrollHeight + 'px';
};
}
});
[/code]
und das ist der Such-JS-Code:
[code] 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();
[/code]
Ich verwende auch Datentabellen für meine Tabelle.