Page 1 of 1
Einbinden mehrerer Tabellen in einer Seite, Anwendung iframe und Tablesorter
Posted: Fri Dec 22, 2017 1:28 pm
by Koba
Hallo Zusammen,
ich habe folgendes vor:
Auf einer im CMSimple angelegten Seite "Mitglieder" soll eine Mitgliederliste in Tabellenform angezeigt werden. Als Grundlage dient eine csv-Datei (Mitglieder1.csv), die regelmäßig aktualisiert wird.
Eingebunden habe ich die Tabelle über
{{{PLUGIN:csv_as_table('PFAD_ZUR_DATEI');}}}
, wie in
viewtopic.php?f=16&t=4174&p=24921&hilit ... ble#p24921 beschrieben. Klappt alles hervorragend!
In der userfunc.php habe ich der Tabelle noch die Klasse "Tablesorter" zugewiesen
. Das Plugin Tablesorter-XH ist installiert.
Die Sortierung der Tabelle funktioniert auch wie gewünscht.
Es sollen aber zwei weitere Tabellen eingebunden werden (Ehrenmitglieder.csv und Jubilare.csv). Funktioniert auch, aber leider nicht mehr sortierbar -die Einschränkung ist ja bekannt.
Jetzt mein Problem oder meine Frage:
Ich würde die beiden Tabellen auf zwei "unsichtbaren" Seiten im CMSimple-Baum sortierbar anlegen und via z.B. iframe auf der Seite Mitglieder einbinden wollen.
Das klappt aber irgendwie nicht. Wenn ich die Seite über iframe einbinde
Code: Select all
<iframe src="./?Ehrenmitglieder" width="300" height="150"></iframe>
bekomme ich die Meldung "Dieser Inhalt kann nicht in einem Frame angezeigt werden". Gibt es andere Möglichkeiten oder muss ich tatsächlich den Weg gehen und für jede Tabelle eine einzelne Seite erstellen?
Danke für Eure Hilfe.
Koba
Re: Einbinden mehrerer Tabellen in einer Seite, Anwendung iframe und Tablesorter
Posted: Fri Dec 22, 2017 2:38 pm
by Koba
Ok, ich habe da mal
Code: Select all
{{{geturl('http://.../?Ehrenmitglieder&print');}}}
noch ausprobiert. Ohne Print ist es wohl nicht möglich, nur den Content auszulesen?
Leider ist allerdings auch hier die Tabelle nicht sortierbar. Muss mir wohl doch was anderes einfallen lassen.
Re: Einbinden mehrerer Tabellen in einer Seite, Anwendung iframe und Tablesorter
Posted: Fri Dec 22, 2017 4:46 pm
by cmb
Koba wrote:Das klappt aber irgendwie nicht. Wenn ich die Seite über iframe einbinde
Code: Select all
<iframe src="./?Ehrenmitglieder" width="300" height="150"></iframe>
bekomme ich die Meldung "Dieser Inhalt kann nicht in einem Frame angezeigt werden".
Hast du in der Konfiguration bei Security → Frame Options eventuell DENY eingestellt? Dann können die CMSimple_XH Seiten nämlich nicht in IFrames dargestellt werden – ansonsten sollte das funktionieren. Also ggf. zu SAMEORIGIN ändern.
Koba wrote:Ohne Print ist es wohl nicht möglich, nur den Content auszulesen?
Ohne &print wird immer die komplette Seite geliefert (inclusive Menü, Newsboxen etc.) &print liefert nur den Content-Bereich. Man könnte aber auch ein seitenspezifisches Template nutzen, dass eben genau das enthält, was man will. Das bietet sich i.d.R. aber nur bei versteckten Seiten an.
Koba wrote:Es sollen aber zwei weitere Tabellen eingebunden werden (Ehrenmitglieder.csv und Jubilare.csv). Funktioniert auch, aber leider nicht mehr sortierbar -die Einschränkung ist ja bekannt.
Bekannt und dokumentiert ist diese Einschränkung schon – aber eigentlich
ziemlich bescheuert. Kurzfristig kann ich allerdings leider nicht nachbessern.
Re: Einbinden mehrerer Tabellen in einer Seite, Anwendung iframe und Tablesorter
Posted: Fri Dec 22, 2017 8:44 pm
by lck
cmb wrote:Ohne &print wird immer die komplette Seite geliefert (inclusive Menü, Newsboxen etc.) &print liefert nur den Content-Bereich. Man könnte aber auch ein seitenspezifisches Template nutzen, dass eben genau das enthält, was man will. Das bietet sich i.d.R. aber nur bei versteckten Seiten an.
Koba wrote:Leider ist allerdings auch hier die Tabelle nicht sortierbar. Muss mir wohl doch was anderes einfallen lassen.
Und als Newsbox in die Seite einbinden, funktioniert dann die Sortierung?
Einbinden kann man es so (News01 kann natürlich auch anders benannt werden, also auch Ehrenmitglieder):
Re: Einbinden mehrerer Tabellen in einer Seite, Anwendung iframe und Tablesorter
Posted: Fri Dec 22, 2017 9:10 pm
by cmb
lck wrote:Und als Newsbox in die Seite einbinden, funktioniert dann die Sortierung?
Nein, weil Selectoren wie `.tablesorter tr` verwendet werden. Gibt es mehrere .tablesorter-Tabellen auf der gleichen Seite (meint, im gleichen Dokument), dann dürfte Chaos entstehen.
Re: Einbinden mehrerer Tabellen in einer Seite, Anwendung iframe und Tablesorter
Posted: Mon Jan 22, 2018 7:56 pm
by Koba
Vielen Dank für eure Ratschläge. Ich habe letztlich eine Tabelle direkt auf der betreffenden Seite eingebunden, eine weitere auf einer nicht direkt sichtbaren Unterseite. Diese habe ich über iframe eingebunden.
Das funktioniert in meinen Augen ganz gut.
Aber über ein Problem bin ich dann doch noch gestoßen. Ich glaube aber nach meinen Recherchen im Netz, dass dies gar nicht so einfach lösbar ist.
Die Tabellendaten liegen ja als csv-Datei vor, welche über den Pluginaufruf csv-as-table als Tabelle dargestellt wird. Mit dem Tablesorter kann der Besucher sich seine Sortierpreferenzen selbst aussuchen. Mein aktuelles Problem: Die csv-Datei wird so als Tabelle ausgegeben, wie sie ist - von Grund auf alphabetisch sortiert.
Aber ich schreibe nun neue Datensätze per Script in die Datei, die werden folglich hinten angehängt. Die alphabetische Sortierung ist also zunächst nicht mehr gegeben.
Ist es möglich, die Tabelle immer von Beginn an automatisch alphabetisch sortieren zu lassen, ohne dem Benutzer die Möglichkeit zu nehmen, selbst anders zu sortieren?
Zur Verdeutlichung die testweise veröffentlichte Website:
http://mgz.rantr.de/?Mitglieder . Bei der zweiten kürzeren Tabelle ist dies recht übersichtlich zu sehen.
Danke im Voraus wiedereinmal für eure Hilfe.
Koba
Re: Einbinden mehrerer Tabellen in einer Seite, Anwendung iframe und Tablesorter
Posted: Mon Jan 22, 2018 10:07 pm
by cmb
Koba wrote: ↑Mon Jan 22, 2018 7:56 pm
Die Tabellendaten liegen ja als csv-Datei vor, welche über den Pluginaufruf csv-as-table als Tabelle dargestellt wird. Mit dem Tablesorter kann der Besucher sich seine Sortierpreferenzen selbst aussuchen. Mein aktuelles Problem: Die csv-Datei wird so als Tabelle ausgegeben, wie sie ist - von Grund auf alphabetisch sortiert.
Aber ich schreibe nun neue Datensätze per Script in die Datei, die werden folglich hinten angehängt. Die alphabetische Sortierung ist also zunächst nicht mehr gegeben.
Ist es möglich, die Tabelle immer von Beginn an automatisch alphabetisch sortieren zu lassen, ohne dem Benutzer die Möglichkeit zu nehmen, selbst anders zu sortieren?
Zur Verdeutlichung die testweise veröffentlichte Website:
http://mgz.rantr.de/?Mitglieder . Bei der zweiten kürzeren Tabelle ist dies recht übersichtlich zu sehen.
Eigentlich ganz einfach, wenn alle Tabellen nach der selben Spalte(nnummer) sortiert werden sollen (im Beispiel Spalte 3):
Code: Select all
Array.prototype.forEach.call(document.querySelectorAll(".tablesorter th:nth-child(3) button"), function (button) {button.click();});
Das klappt prima, wenn man es in der Browserkonsole eingibt. Wenn man es allerdings automatisiert ausführen will, kann man es aber nicht einfach beim Laden des Fensters (window.onload) triggern, weil dann die Tabelle u.U. noch gar nicht fertig initialisiert ist. Also den Code am besten vor
dieser Zeile einfügen.
Kniffliger wird es, wenn die Tabellen nach unterschiedlichen Spalte(nnummern) sortiert werden sollen, weil man mit CSS wohl nicht nach Content selektieren kann. Da könnte man aber der gewünschten Spalte (also dem <th>) manuell eine Klasse zuweisen (beispielsweise .presort), und dann den Code entsprechend ändern:
Code: Select all
Array.prototype.forEach.call(document.querySelectorAll(".tablesorter th.presort button"), function (button) {button.click();});
Re: Einbinden mehrerer Tabellen in einer Seite, Anwendung iframe und Tablesorter
Posted: Thu Jan 25, 2018 1:14 pm
by Koba
Super, das klappt perfekt!
Ich habe mich für deinen erste aufgezeigte Codevariante entschieden, da (für mich) einfacher umsetzbar. Ist trotzdem kompliziert genug, da da hinter zu steigen
Aus diesem Grund extra nochmal vielen Dank generell für dieses Forum und eure engagierte Hilfe!
Re: Einbinden mehrerer Tabellen in einer Seite, Anwendung iframe und Tablesorter
Posted: Thu Jan 25, 2018 2:19 pm
by cmb
Koba wrote: ↑Thu Jan 25, 2018 1:14 pm
Ist trotzdem kompliziert genug, da da hinter zu steigen
Der Code lässt sich auch anders schreiben:
Code: Select all
var buttons = document.querySelectorAll(".tablesorter th:nth-child(3) button");
for (var i = 0; i < buttons.length; i++) {
buttons[i].click();
}
In der ersten Zeile werden die gewünschten Buttons selektiert (der Ausdruck in Anführungszeichen ist ein normaler CSS-Selektor). Danach werden die gefundenen Buttons durchlaufen, und für jeden dessen .click() Methode aufgerufen, die einen Benutzerklick simuliert.