Hallo,
ich habe tabcontrol installiert, leider finde ich nirgendwo eine Möglichkeit die einzelnen Reiter zu definieren. Jemand ein Tipp?
nutze v2.7.2
Druckbare Version
Hallo,
ich habe tabcontrol installiert, leider finde ich nirgendwo eine Möglichkeit die einzelnen Reiter zu definieren. Jemand ein Tipp?
nutze v2.7.2
Hallo Southbridge,
nichts für ungut, aber lesen bildet: jetzt lesen
tja dann bleib ich wohl ungebildet, denn ich sehe immer noch keine Möglichkeit die einzelnen Reiter (nicht Reitercontents) zu definieren...
Hallo,
ich meine - da schon einige Zeit her, seit ich das Modul getestet habe, das da viel CSS im Spiel ist.
Ich schau gerne nochmal nach und gebe Feedback.
Hallo,
1. Hat jemand mal TabControl mit 2.7.2 getestet?
2. Ich habe es installiert und in einem Artikel die Elemente
- Reiter ### TabControl: tabs ###
- Reiter ### TabControl 1. Pane START ###
- Text
- Reiter ### TabControl 1. Pane END ###
- Reiter ### TabControl 1. Pane START ###
- Text
- Reiter ### TabControl 1. Pane END ###
Das ganze erscheint im Quelltext, aber auf der Seite ist von Reitern nix zu sehen.
Auch sehe ich wie Southbridge keine Möglichkeit Reiter zu definieren oder zu beschriften.
Vielleicht könnte jemand eine Anleitung für Dummies erstellen...
Grüße, Matthias
Hallo Sahel,
ich habe heute mal Tabcontrol (in TL 2.7.2) ausprobiert, weil ich es vielleicht einsetzen wollte.
Bei mir tritt der gleiche Effekt auf, den Du beschreibst:
Beim obersten Element, der Reitergruppe gibt es keine Möglichkeit, die einzelnen Reiter zu definieren. Auf dem Bild in der Anleitung steht so einfach
1.Test1
2.Test2
3.Test3
Wie kommt das dahin? Es gibt keine Eingabemöglichkeit.
Und so viel gibt es ja auch nicht zu lesen (nach dem Hinweis von Stefan).
Hallo zusammen,
ich setze die Erweiterung unter TL 2.7.2 ohne Probleme ein (siehe Grafik).
Folgendes CSS setze ich dazu ein:
Edit:Code:/* Style sheet tabs */
.ce_tabcontrol_tabs{padding-top:2px;border-bottom:10px solid #e6e6e6;}
.ce_tabcontrol_tabs ul{margin-left:0px;}
.ce_tabcontrol_tabs ul li{float:left;display:block;margin-right:3px;margin-left:3px;padding:8px 10px 8px 6px;text-align:center;background-color:#f5f5f5;border-top:1px solid #e6e6e6;border-right:1px solid #e6e6e6;border-left:1px solid #e6e6e6;color:#29166f;list-style-type:none;center;border-bottom:1px solid #f5f5f5;-moz-border-radius-topleft: 5px;border-top-left-radius: 5px;-moz-border-radius-topright: 5px;border-top-right-radius: 5px;}
.ce_tabcontrol_tabs ul li.selected{padding:8px 10px 8px 6px;background-color:#e6e6e6;border-bottom:1px solid #e6e6e6;color:#d10000;}
.tabs{font-weight:bold;}
.hover{cursor: pointer;}
.panes{padding-bottom:10px;background-color:#e6e6e6;}
Ich muss mich korrigieren, bereits angelegte Reitergruppen funktionieren, neu anlegen produziert hingegen den beschriebenen Fehler...
Siehe auch dieser Thread: https://community.contao.org/de/showthread.php?t=621
Gruß
Hallo StephanE,
danke für Deinen Screenshot, das bringt etwas Licht ins Dunkel.
Bei mir sieht es so aus:
Anhang 127
und Du musst zugeben, da ist dann das Arbeiten etwas schwierig.
Zusätzlich kommt im Backend die Fehlermeldung, wenn man den ganzen Artikel ansieht:
Code:Warning: Invalid argument supplied for foreach() in /var/www/web59/html/portal1/system/modules/tabcontrol/ContentTabControl.php on line 127
Warning: Cannot modify header information - headers already sent by (output started at /var/www/web59/html/portal1/system/functions.php:122) in /var/www/web59/html/portal1/system/libraries/Template.php on line 174
Hallo do_while,
leider musste ich meine Antwort korrigieren, der gleiche Fehler tritt bei mir auf, wenn ich eine neue Reitergruppe anlegen will, bestehende funktionieren.
Gruß
Hallo,
ich habe mal kurz aus Eigen-Interesse in den Source geschaut.
Bei mir bekomme ich wieder alle Eingaben, wenn ich folgende Datei austausche:
TL_ROOT/system/modules/tabcontrol/dca/tl_content.php
Das kann hier nur ein kurzfristiger Workaround sein, ich denke mal, der Autor wird sich das Problem in Kürze anschauen und eine Lösung ins Repository spielen.
Hier das Patch:
tl_content.zip (Der Patch war noch nicht so gut, siehe neueren Beitrag)
Hallo,
@Hagen: Ja, mit dem Patch funktionieren die Tabs.
Ein weiteres Problem ist, das ich nun in den Artikel überhaupt kein weiteres Element mehr einfügen kann, weder innerhalb noch außerhalb des ganzen Tabcontrol - Bereichs. Jedes neue Element wird als Reiter behandelt; die Auswahl anderer Elemente wird nicht angenommen. Beispiel: Überschrift oberhalb "Reiter ### TabControl: tabs ###" einfügen. Ergebnis siehe screenshot.
Liegt das am Patch oder war das vorher auch so?
Gruß, Matthias
Hallo Matthias,
Du hast Recht, soweit hatte ich dann nicht mehr getestet.
Da gibt es wohl Namenskonflikte mit anderen Einstellungen. Deshalb hiessen die Paletten dann auch 'tabcontrolstart' und nicht nur 'start'.
Ich habe jetzt ein wenig anders umgebaut, jetzt scheint's zu funktionieren.
(Wie gesagt: ich kenne die Extension nicht richtig, bin auch nur ein Nutzer. Der Autor sollte noch einmal draufsehen und ggf. korrekte Änderungen machen)
@StephanE: Du hast jetzt in der Datenbank Einstellungen, die nicht mehr gültig sind. Du müßtest in allen Elementen noch einmal speichern.
Im ZIP sind jetzt 3 Dateien enthalten, da auch Textvariablen geändert werden mussten:
tabcontrol2.zip (Der Patch war noch nicht so gut, siehe neueren Beitrag)
Hallo Hagen,
Super, auch dieser Patch funktioniert. Vielen Dank!
Wäre schön, wenn der Entwickler noch mal drübergeht und ein Update bereitstellt. Tabcontrol ist sicher ne willkommene Alternative zum Accordeon.
Gruß, Matthias
Hallo,
mein Patch war noch nicht vollständig. Im Frontend kamen Fehler bei der Darstellung.
Ich habe auch da noch ein bisschen gepatcht, jetzt scheint's zu gehen.
Mein neuester Patch, mit noch einer Datei mehr:
Anhang 133
Halli-hallo,
Folgende Frage, ich möchte bei Reiter-basierten Inhalten jeden Reiter per CSS anders gestalten. in meinem Fall möchte ich jedem Reiter ein Piktogramm hinzufügen.
Lässt sich das mit TabControl machen?
I möchte auch kurz fragen: Sind bei de-aktiviertem JS alle Inhalte sichtbar?
(Leider habe ich bisher nur die alte version installiert und konnte deshalb nicht testen. Tschuldi, dass ich jetzt nachfrage bevor ich weitere "Anstrengungen" unternehme.)
Besten Dank
Tagchen,
sorry dass ich mich erst jetzt zu Wort melde, ich war in letzter Zeit arbeitstechnisch stark eingespannt.
Bzgl. der TabControl-Extension in Verbindun mit TL2.7.2 kann ich gegenwärtig noch nicht viel sagen, da ich selbst noch nicht zum testen gekommen bin, werde das aber die nächsten Tage nachholen.
Aktuell sieht es allerdings so aus, dass ich sowieso an einer stark überarbeiteten Version des TabControl sitze, welches dann auch mit Ein-/Ausblendeffekten daher kommt. Da kann ich dann auch gleich individuelle Klassen für die Reiter einbauen, allerdings wird das ganze noch ein Weilchen dauern.
Mehr zum gemeldeten Fehler gibt es dann im Laufe des heutigen Abends.
LG,
Jean
Edit: Soeben habe ich ein Bugfix Release (v1.1.1) ins Repository gestellt, welches alle gemeldeten Fehler beheben sollte. Danke an do_while für die Fehlersuche :)
Hallo Brains.
Das Update in der Repository scheint noch nicht so richtig zu funktionieren. Aus der TL-Installation ist die Version 1.1.1 gar nicht sichtbar (wird kein Update angezeigt) und direkt in der Repository erscheint zwar die Version 1.1.1 als "alternative", der Link führt aber ins Leere. Scheinbar ist bei dir etwas beim Veröffentlichen in der Repository schief gelaufen.
Mit dem Patch von do_while ist es aber ein Hammer-Erweiterung :D
Hallo,
keine Ahnung was da schief gelaufen ist, jetzt gibt es auf jedenfall v1.1.3 b6 die endlich die Fehler behebt und sich sogar über die Erweiterungsverwaltung updaten lässt :)
LG,
Jean
P.S.: Da ich jetzt wieder ein bisschen mehr Zeit habe mich um diese und weitere Erweiterungen zu kümmern, wäre es für mich interessant zu wissen welche Features ihr Euch vom TabControl wünscht.
Geplant (und zum Teil umgesetzt) sind bereits:
a) wählbarer Ein-/Ausblendeffekt.Zur Zeit wären das Ein-/Ausfaden und Ein-/Ausklappen von oben oder unten. Wer diesbezüglich Wünsche oder Vorschläge hat, bitte Bescheid geben
b) Einstellbare Klassen je Reiter
c) Panele als Ajax-Elemente kennzeichnen und somit zur Laufzeit nachladen lassen
Die zweite Erweiterung wird eine Art CoverFlow-ContentElement werden. In kombination mit dem TabControl kann das ganze dann eine recht schlichte Seite nett aufpeppen (siehe hier). Falls Ihr dazu Ideen und Anregungen habt wäre ich Euch echt dankbar :)
Bei Erweiterung Nummer drei, handelt es sich eher was für die Coder unter Euch, einen JavaScript Namespace-Generator mit ClassLoader. Wer gerne im Code rumschnüffelt oder Ideen zu dem Thema hat kann sich gerne melden, ich bräuchte da noch Unit-Tests und Beispiele für die Docu :)
LG,
Jean
Hallo Brains.
Wünsche/Anregungen für TabControl:
- Die Listenpunkte müssten noch einen inneren Bereich haben, damit man graphisch ansprechende Buttons per CSS definieren kann, die nicht von der Länge des Eintrages abhängen. Momentan habe ich das Template dazu mit zwei DIV-Bereichen erweitert, die den rechten und Linken graphischen Anteil darstellen.
- Wenn die Länge aller Reiter größer wird, als die verfügbare Breite, sollte die Leiste scrollbar werden (kenne den Effekt aus ExtJS)
- Eine Vorgabe, ob die Tabs (oder sogar einzelner Tab) eine bestimmte Höhe haben sollen.
- In der Erweiterung Subcolumns wird beim Anlegen der Spaltencontainer schon die Start- und End-Bereiche angelegt. Bereiche ab wann welche Spalte anfäng, sind gekennzeichnet. Dieses Verhalten finde ich persönlich angenehmer, als Anfang und Ende jedes Tabs (zumindest beim ersten Anlegen) manuell anzulegen. Ab 3 Tabs wird es einfach mühsellig. Alle notwendigen Parameter sind ja vorhanden.
- Beim Löschen des Tabcontrols sollten natürlich die Container, aber nicht deren Inhalt mit gelöscht werden.
Zum Coverflow:
Wäre interessante Erweiterung, insbesondere wenn es nicht nur als Bildergallerie nutzen liese, sonder auch als Navigationsmenü
Das ist momentan alles was mir so einfällt :D
Und danke noch mal für die sehr nützliche Erweiterung
Hallo Brains.
Habe gerade die neue Version auf einer Neuinstallation getestet (Bezug über Extension-Manager und manuelle Installation). Nach der Installation können keine weiteren Inhaltselemente hinzugefügt werden, außer Tabcontrol, siehe Screenshot.
Bleibt weiterhin nichts anderes übrig, als bei dem Patch von do_while auf dem Produktivsystem zu bleiben.
Gruß
Hallo,
bei mir ist das gleiche Problem... kann keine anderen Elemente anlegen.
Weiterhin wäre es GUT wenn Du die Aktualisierungen so gestalten würdest das man nach einem Update nicht alle Tabs neu anlegen muss.
Ich musste alle schon vorhandenen Tabs aufrufen und zuweisen.
Gruß Ralf
Moin,
nun sollte alles wieder gehen :)
LG,
Jean
Hallo Brains.
Wo finde ich die neue Version? In der Repository finde ich nur die alte Version 1.1.3. Oder wurde diese direkt aktualisiert ohne Versionssprung?
In der Repository finde ich nur die Version 1.1.0 Stable.
Deswegen habe ich auch nur Bugs in der Typolight Installation :(
Noch ein paar Vorschläge für TabControl
- Link-Anker für die Tab-Content Elemente, um ohne JS direkt zu den Inhalten zu "springen". Dafür müssen die Tabs natürlich in A-Tags eingeschlossen werden und zu den Ankern weisen.
Für grafisch anspruchsvollere Tabs benutze ich folgendes HTML-Konstrukt:
Damit kann ich dann explizite Grafiken für linke und rechte Seiten angeben (und für das Zentrum), unabhängig von der Länge des TabsHTML-Code:<div class="ce_tabcontrol_tabs block">
<ul>
<li class="tabs"><a href="#"><span>Tab 1</span></a></li>
<li class="tabs"><a href="#"><span>Tab 2</span></a></li>
<li class="tabs"><a href="#"><span>Tab 3</span></a></li></a></li>
</ul>
</div>
Hi WebDucer,
also die interne Verlinkung über ids wird definitiv in der nächsten Version drin sein, darum hatte Nina mich schon gebeten :)
Was die span-Elemente angeht, daran hatte ich noch gar nicht gedacht, aber das lässt sich auf jeden Fall einbauen. Danke für diese Anregung und natürlich auch für die vorangegangenen Anregungen, die sind nicht in Vergessenheit geraten. Speziell die SubColumns-Verhaltensweise werde ich versuchen so gut als möglich umzusetzen. Was die von Dir gewünschte Scrolling-Funktionalität angeht, so bin ich aktuell noch am Überlegen ob ich es eher als eigenes ContentElement umsetze um das ganze so flexibel wie möglich zu halten oder per Checkbox zuschaltbar mache. Was wäre denn aus Deiner Sicht die bessere Alternative?
Nur mit der Anregung, die Höhe einstellbar zu gestalten, habe ich gerade noch ein paar Zweifel, da ich der Meinung bin, dass das eine reine CSS Frage ist.
LG,
Jean
Hallo Brains.
Die Scrollfinktionalität würde ich eher als eigene Erweiterung sehen, die aber in TabControl einfach über eine Checkbox praktisch gleich auch benutzt wird. Damit hast du beides. Eine unabhängige Erweiterung für scrollbare Inhalte und ein einfach zu benutzendes TabControl.
Wegen der einstellbaren Höhe, gebe ich dir Recht. Es ist auch über CSS sehr gut einstellbar.
Noch ein paar Punkte sind mir heute eingefallen:
- Wenn man die Reihenfolge der Tabs in "Reitergruppe"-Element ändert, sollten auch die dazugehörigen Inhalte des Tabs entsprechend verschoben/sortiert werden (wahrscheinlich nur sehr schwer oder gar nicht realisierbar).
- Angeben eines Start-Tabs. Also welcher Tab soll beim Aufruf der Seite aktiv sein (eventuell auch merken, welchen Tab, man als letztes offen hatte)
- Direkte Navigation von Außen über Linkt zu einem bestimmten Tab. Mit dem Parameter, welcher Tab beim öffnen der Seite aktiv sein sollte, müsste das auch ohne größere Probleme funktionieren.
Ich hoffe, ich überschütte dich nicht mit Vorschlägen :D. Finde die Erweiterung aber sehr nützlich, wenn man viel Inhalt auf einer Seite unterbringen muss und nutze diese auch ausgiebig momentan.
Gruß
WeubDucer
Ja, das ist ein guter Kompromiss :)
Hmm, das wäre natürlich sehr luxuriös in Sachen Bedienung. Mal sehen ob ich da was machen kann
Sehr guter Punkt, Start-Tab sollte sich einigermaßen einfach zu realisieren sein. Wegen der Speicherung des selektierten Tabs muss ich mal schauen.
[QUOTE=WebDucer;6464]Direkte Navigation von Außen über Linkt zu einem bestimmten Tab. Mit dem Parameter, welcher Tab beim öffnen der Seite aktiv sein sollte, müsste das auch ohne größere Probleme funktionieren.[QUOTE]
Japp, das lässt sich definitiv umsetzen :)
Ganz uns gar nicht, die Eweiterung lebt ja von Erfahrungsberichten und Erfahrungen im täglichen Umgang. Also nur her mit den Vorschlägen :)
LG,
Jean
Hi,
ich setzt die Erweiterung seit letzter Woche auch ein.
In diesem zusammenhang habe ich folgendes festgstellt.
Kombiniert man das Inhaltsemlement (IE) Reiter mit einem IE Akkordeon (das Akkordeon Vorrangestellt) so führt dies teilweise zu einem Bug.
In meinem Fall schaut das etwa so aus.
Akkordeonstart
Reiter
Reiteranfang
IE Tabelle
IE Download
Reiterende
Akkordeonende
Akkordeonstart
Reiter
Reiteranfang
.... usw.
Wenn ich nun bei meinem Reiter auf eine Auswahl gehe so schneidet er mir die Länge meiner Tabelle irgendwann einfach ab bzw. wechsel ich zwischen den einzelnen Reitern wird das was von der Tabelle angezeigt wird immer weniger.
Kann jetzt auf die Schnelle kein Screenshot machen aber wenns benötigt wird dann lässt sich das auch einrichten.
Ansonsten verwernde ich mein eigenes css. Meine Reiter schauen ähnlich dem Menü der Webconsulting oberfläche aus. Sprich silber mit Hover effekt
Hi Acta,
ich kann den Fehler leider nicht nachbilden, kannst Du mir per PM die URL von der Seite schicken, dann kann ich mal schauen wo der Fehler liegt :)
LG,
Brains
Ist leider ein internes Netzwerk.
Also so schauts jetzt aus . habe es mit einzelnen Akkordeonelementen gemacht damit sich das meiner Übersicht anpasst. (Reiter4)
Ehm... genau und den Fehler hab ich für dich auch mal nachgebaut.
Die bilder reiter 1 und 2 zeigen den Fehler
und Reiter 3 den Aufbau im backend
Hallo Brains,
schöne Erweiterung. Ich fände es noch sehr nützlich, wenn die Listenpunkte der Reitergruppe noch mit first und last, wie es häufig in TYPOlight gemacht wird, versehen würde. Dann könnte man den ersten und den letzten Punkt leichter per CSS ansprechen.
Vielen Dank,
Torben
Nachtrag: Wollte es vorerst über selbst vergebene Klassennamen lösen, aber leider wird die Klasse tabs nicht ersetzt (panels schon).
@Acta: Leider kann ich auf Basis der Bilder keine Fehleranalyse machen. Ich tippe darauf, dass es an einer bestimmten Kombination von CSS-Anweisungen liegt. Um das zu prüfen müsste ich aber im Code rumschnüffeln können. Verstehe ich das richtig, dass Du das Problem jetzt anders gelöst hast?
@Torben: Danke für den Hinweis, ich werde es in der nächsten Version einbauen :)
Sagen wir´s so : Ich habe die Bequeme variante Genommen und die Akkordeon ringsrum weggelassen.
Aber für eine neue Arbeit würde ich gerne wieder Akkordeons und Reiter kombinieren.
Wie lösen wir die Sache.
Ich könnte heute nachmittag mal privat meine Funpic server wieder in gang setzen und da Typolight drauf machen. Und dann erstell ich dir die Seite samt fehler.
Wenn ich soweit bin schick ich dir einen PN mit den Zugangsdaten fürs Backend.
MFg
Sebastian
So nun weiß ich woran es genau liegt.
Anscheind orientiert sich der Pannel an der Höhe der gesamten Inhaltselemente im ersten Pannel... wenn ich jedoch im zweiten oder Dritten Pannel eine Tabelle habe die höher ist als die Tabellen bzw. inhalte zuvor schneidet er mir die hälfte weg.
zu sehen nun auch unter:
http://bargsebastian.ba.funpic.de/ty...eitertest.html
Gibt in der Richtung irgendwas neues?
Hallo
Für ein Testszenario schalte ich durch Iframes per tabconrol. Eine Seite im Iframe enthält ebenfalls Tabcontrol. Die Tabs im Iframe funktionieren nicht mehr. Weiß jemand Rat, wie ich Tabs instanzieren kann?
besten Dank
skraddy
Ich hab auch noch was, wenn man in ein Tab eine gallery legt wird wenn man bei der Pagination weiterklickt leider nicht die nächste galleryseite angezeigt sondern der Focus auf das erste Tab gelegt.
Wäre cool wenn dieser Fehler behoben wird?
Hallo,
ist es eigentlich möglich, Tabcontrol Version 1.1.3 unter TYPOlight Version 2.7.5 zum Laufen zu bringen?
Bei mir sind die Reiter nicht anklickbar und es sind auch alle Tab-Inhalte zugleich zu sehen.
Es ist so, als ob irgendwas Entscheidendes fehlen würde...?
Gruß
Michael
Ich tippe mal auf Javascript, was da fehlt. Kopiere mal die Seite in eine Testseite und setze das Standard-Seitenlayout fe_page, dann sollte es gehen. Dann kannst Du Stück für Stück die Unterschiede untersuchen.
Hallo Hagen,
danke für den Tipp, du hast recht, mit dem Standard-Seitenlayout bzw. Standard-Template klappt alles, wie es soll. Jetzt muss ich im Detail schauen, wo das Problem liegt.
EDIT: Peinlich, peinlich.... Ich hab schlicht und einfach vergessen <?php echo $this->head; ?> in mein Template zu schreiben, und daher wurde auch "tabcontrol.js" nicht eingebunden. :o
Vielen Dank für die schnelle Hilfe!
Gruß
Michael
Schön, dass es jetzt läuft ... :D
Tolle Erweiterung!
Ich würde es noch schön finden, wenn man dem Elementtyp "Reiter" > Betriebsart "Reitergruppe" noch eine allgemeine Überschrift verpassen könnte.
Lässt sich dieser Wunsch noch in die Erweiterung implementieren?
Fade in und out wären noch ein super feature, dann wäre es perfekt :D
wie z.b. hier, aber mit auswahl für effekte im backend. z.b. fx type und duration. (um das ganze noch schön abzurunden)
http://www.silverscripting.com/mootabs/
Prima Erweiterung. Danke.
Hat aber noch eine "Macke"
grand schrieb:
Habe genau das gleiche Problem, allerdings nicht mit einer Galerie, sondern mit zwei "gepipten" RSS-Feeds auf zwei von drei Reitern. Der zweite Feed ist der übersetzte des ersten(EN->DE). Beim Anklicken einer Seite in der Paginierung wird man auf die korrespondierende Seite des ersten Tab (EN) gesetzt. Leider hab ich noch nicht geschnallt woran das liegen mag.Zitat:
Ich hab auch noch was, wenn man in ein Tab eine gallery legt wird wenn man bei der Pagination weiterklickt leider nicht die nächste galleryseite angezeigt sondern der Focus auf das erste Tab gelegt.
Wäre cool wenn dieser Fehler behoben wird?
Hat jemand eine Idee? Brains?
Übrigens funktioniert tabcontrol sonst unter 2.7.5 einwandfrei.
Dann mal Danke!
Hallo,
wollte mal nachfragen ob wer rausgefunden hat warum der Focus nicht auf das richtige Fenster gelegt wird?
Hallo,
dickes Sorry, ich hab in den letzten Monaten null Zeit gehabt mich um die Extension bzw. Euere Fehlermeldungen und Erweiterungswünsche zu kümmern.
Ich hoffe dass ich ab Februar wieder mehr Zeit dafür habe.
Was das Problem mit dem Seitenwechsel angeht, an sich ist es kein Fehler sondern ein Feature das noch nicht implementiert ist. Beim Seitenaufruf wird standardmäßig das erste Panel angezeigt, da das TabControl sich nicht merkt welches Panel zuvor sichtbar war. Ich bin mir gerade nicht ganz sicher ob ich das irgendwie in eine Komponente wie etwa Pagination einbetten kann automatisch das richtige Tab zu öffnen, werde es aber versuchen. Auf die Schnelle fällt mir auch kein Workaround für Eure Anforderung ein. Sollte mir was einfallen schreibe ich es in den Thread :)
LG,
Jean
Super danke schonmal!!
;)
Ich habe irgendwie von dieser JavaScript oder Ajax-Technik die hier eingesetzt wird nicht so den Durchblick.
Deshalb werfe ich einfach mal folgende Frage ein:
Wäre es möglich, diese Extension so anzupassen, dass man auf die verschiedenen Panes anstatt über die Reiter dann über eine einfache "Vor und Zurück"-Navigation zugreifen könnte?
Denn wenn man in der Breite nicht so viel Platz hat und trotzdem eine Menge Reiter unterbringen will oder muss, sieht es schlecht aus.
Wer kann da mit Durchblick Tipps geben, wie man so etwas anpassen könnte oder ob das überhaupt irgendwie möglich wäre.
Bedanke mich.
Hallo Forum,
Hallo Jean,
ich befasse mich erst seit wenigen Tagen mit TL und bin bei der Suche nach einer Umsetzung auf TabControl gestoßen.
Mein Ziel:
- Mehrere Reitergruppen auf einer Seite
- Jede Reitergruppe enthält zwei Panes
Dieses ist dank Tabcontrol kein Problem mehr
- In Pane 1 befindet sich ein Link um Pane 2 zu öffnen
- In Pane 2 befindet sich ein Link um Pane 1 zu öffnen
Diese Togglefunktion habe ich noch nicht hinbekommen, da ich scheinbar nicht fähig bin, den korrekten Befehl zu finden, welcher den Tabs zugewiesen ist.
[edit]okay ich bin etwas weiter. Zeile 170 ff. in der zugehörigen js-datei ist wohl der Schlüssel zum Bau einer Toggle-Funktion.[/edit]
[edit2]mit Workaround gelöst. Lösung im folgenden Post beschrieben[/edit2]
- Beim Wechsel von einer Pane zur anderen sollte ein Scrollen+Faden auftreten.
- Erst wird Pane 1 ausgeblendet, danach Pane 2 ein.
Ich habe das mit ein bissl javascriptgeschnippsel und jqueryvergewaltigung mal anskizziert.
(Klick auf das Bild unter "noch Fragen?" in der Sidebar bzw. auf die zweite Referenz "EADS")
Habt ihr da evtl. ein paar Überlegungen parat?
Bin für jede Hilfe dankbar!
okay - update soweit.
Togglefunktion über folgenden Umweg realisiert: Vorrausgesetzt, dass wirklich immer nur zwei Panes benutzt werden sollen (oder eins.), ist folgender Workaround vergleichsweise einfach möglich.
Ich habe in der plugins/tabcontrol/tabcontrol.js nach zeile 119 der _initTabs eineingefügt. So werden bei nur zwei Panes/Tabs die Links der Tabs vertauscht. Dies ermöglicht es, in Pane1 einen Reiter zu setzen, der auf Pane2 linkt und vice versa. Die Tabs können entweder überCode:nach zeile 119 einfügen: tabs.reverse();
gegenverlinkt werden, oder durch einfügen einzelner Reiterelemente *innerhalb* der Wrapper.Code:<div id="tab1">link</div> (pane1)
<div id="tab2">link</div> (pane2)
Und jetzt geh ich an das Problem des umblendens. Falls mir hier jemand zur Seite stehen kann - ich bin für alles offen :)
okay, ich löse es jetzt mit einer eigenen moo-tools lösung. da klappt dann auch das faden :)
Wie kann ich per Link einen bestimmten Tab aktivieren? Im Changelog steht folgendes:
Aber wo kann man das einstellen?Zitat:
[Change] Das beim Laden der Seite anzuzeigende Panel kann nun mittels eines Ankers (z.B. #myPane) festgelegt werden. Somit können Panele direkt verlinkt werden. Falls auf einem Client JavaScript deaktiviert ist, scrollt der Browser automatisch auf das anzuzeigenden Panel. Somit ist die Barrierefreiheit gewährleistet.
Danke.
EDIT: UPS wurde bereits gemeldet der Fehler! Sorry
Hallo,
iih weis nicht ob das im Bugfix bereits behoben wurde, aber ich musste Tabcontrol wieder weglassen da ein verwenden von Galerien in einem Tab nicht funktionierte, ich habe dies bereits vor einiger zeit mal gepostet aber keine Reaktion darauf erhalten.
Das Problem ist, wenn eine Galerie in einem Tab angezeigt wird und diese Galerie eine Pagination besitzt kann man die nächste Seite der Galerie zwar laden aber es wird der Anzeigefocus der Reiter auf den ersten Reiter gelegt und wenn die Galerie somit nicht im ersten Reiter liegt müsste der User erst wieder auf den Galerie Reiter klicken um die zweite Seite zu sehen.
Wäre eine tolle Sache wenn dieser Fehler behoben würde.
LG
G
@Chris87: Du musst nur Deinen Panelen IDs geben, dann kannst Du die direkt verlinken. Mal angenommen Du hast drei Panele mit den IDs pane1, pane2 und pane3, dann kannst Du die direkt referenzieren über:
http://www.mydomain.com/mypage.html#pane1, http://www.mydomain.com/mypage.html#pane2 und http://www.mydomain.com/mypage.html#pane3
Mehr musst Du nicht einstellen, da die Funktionalität immer präsent ist. Das ganze funktioniert allerdings nur beim Laden der Seite.
Solltest Du noch Fragen dazu haben, kannst Du mir gerne eine PM schicken :)
@grand: Doch, Du hast dazu Antwort bekommen, siehe meinen Post vom 24.01.2010, aber ich wiederhole es gerne, das war kein Fehler es war nur nicht implementiert. Mit der neuen Version gibt es nun eine Möglichkeit, nämlich über die Anchor-Technik. Dazu musst Du allerdings Dein Gallerietemplate so anpassen, dass es den Anker mit übergibt.
Für spezielle Verhaltensweisen bei Tabwechsel gibt es zudem ein onChange-Callback, welches die Signatur function(currentPane, currentTab) hat und an das TabControl-Objekt gebunden ist. Der geneigte JavaScript-Programmierer wird wissen was damit gemeint ist und wie es verwendet werden kann. In der Datei plugins/tabcontrol/tabcontrol.js ist dieses Callback dokumentiert.
HTH
Servus.
Gibt es eine Möglichkeit, den einzelnen tabs die entsprechenden Klassen zuzuordnen, wie last/first oder odd/even?
Beste Grüße
Alex
Super! Besten Dank, snau.
Gibt's irgendwo nen Ticket-System für tabcontrol, bei dem man diese Änderung für die nächste Version vorschlagen könnte?
Beste Grüße und einen guten Wochenausklang
Alex
Hallo alle,
im Extension-Repositoty wird eine [tabcontrol] Version "1.2.0 stable" angezeigt, aber ein Klick darauf funktioniert nicht. Welches ist denn nun die aktuelle Version?
Die 1.1.4 stable, die ich herunterladen kann, hat jedenfalls noch keine der versprochenen Änderungen wie etwa die Klassen first/last(/even/odd) oder den Link und Span um den Reitertext. Auch Überblenden ist nicht da, sondern display: block/none.
Zum Problem mit "falsches Tab angezeigt" bei mehrseitigen Galerien (und nicht validen Formularen oder Links, denen man folgt und dann per Back-Button zurückkommt) habe ich die Idee, per JavaScript ein Session-Cookie mit dem Tab-Index zu setzen (im Event onChange) und bei Reload oder Rückkehr auf die Seite auszuwerten. Ähnliches habe ich bereits für Akkordeons realisiert (siehe Wiki bzw. das verbesserte Script hier).
Das einzige Problem: die Cookie-Lösung ist im Konflikt mit der Anker-Lösung. Die Anker-Lösung erlaubt ja gezieltes Springen zu einem/Öffnen eines Tabs. Das ist gut und wichtig und funktioniert, wenn kein Cookie gesetzt ist. Ist nur das Cookie gesetzt, dann funktioniert es auch. Wenn aber beides gesetzt ist, was sollte dann Vorrang haben?
- Cookie hat Vorrang: dann geht die Anker-Lösung komplett flöten, sobald der Besucher die Seite einmal besucht hat, weil das Cookie ab dann immer gesetzt ist
- Anker hat Vorrang: dann ist das Cookie wirkungslos, wenn man via Back-Button auf die Seite zurückkommt. Beim Wechsel des Tabs ändert sich ja die URL nicht, der Anker bleibt drin. Beispiel: per Anker auf Tab 2 gelandet, manuell auf Tab 3 umgeschaltet, dort einem Link gefolgt, Rückkehr via Back: der Anker wird gefunden und Tab 2 angezeigt. Mit nicht validen Formularen, die dann mit Fehlermeldungen wieder angezeigt werden, und mit Inhaltselementen, die eine Paginierung haben (Gallerie, News ...) sollte es aber gehen, weil beim Reload der Seite dann von Hause aus kein Anker gesetzt ist.
Die weniger schlechte Lösung ist also, dem Anker Vorrang zu geben.
EDIT: ich glaube, ich habe auch für den Back-Button eine Lösung: bei Klick auf einen Tab muss der Anker per JavaScript gelöscht werden mit "window.location.hash = '';". Nach einem Vortest (nur in Opera) bewirkt das KEIN Reload der Seite. Ich werde das mal ausprobieren und melde mich dann mit Code wieder.
LG, Georg
... da bin ich wieder (komme von http://www.contao-community.de/showt...l=1#post140108)
Die Ansteuerung von Akkordeon und Tab ist doch "identisch" - ich wünsche mir auf alle Fälle auch Akkordeon(s), die ich per URL direkt "aufschlagen" kann. Somit käme der Cookie-Session-Konflikt auch hier zum Tragen.
Vorab (@soweit_ok) contao erzeugt, soweit ich das nachvollzogen habe, eine Session sofort und bei jedem eine Session, der auf eine Contao-Seite kommt. Ein entsprechender Cookie mit der SID wird gespeichert. Wie das Fallback für "ohne-Cookie aussieht", habe ich nicht so schnell finden können.
Ein Fall-Back fur "ohne-Cookie" wäre somit für beide Varianten interessant....
Dem Anker würde ich aus dem Bauch herraus auch eine höhere Gewichtung als dem Cookie geben. Die Löschung per window.location.hash = ''; ist sicher eine gute Idee.
Bei meinem Versuchen mit window.location.hash = 'irgendwas'; wurde immer ein Reload gemacht und die Seite scrollte "irgendwohin" (glaube an die Stelle wor der Anker wäre, wenn nicht per CSS die Reiter entstünden).
... muss ich nochmal testen - aber ich glaube das Anspringen der Tabs per Anker ging nur, wenn der Link von einer anderen Seite kommt bzw. funktioniert nicht um in einem Tab einen Link zu einem anderen Tab zu machen...(?)
Gruss zonky
Ja, den Contao-Fallback rauszufinden, falls es einen gibt, wenn der Client keine Cookies erlaubt, wäre wohl wichtig, schätze ich. Damit ich es auch verstehe (bin in dem Thema leider nicht so fit wie ihr), sollte es kein Fallback seitens Contao geben, spräche denn etwas dagegen, in dem Fall die Session selbst zu erzeugen und die SID dann per Hidden Input oder als GET-Parameter in der URL zu übergeben? Dann bräuchte man doch kein Cookie, weil die Session im RAM des Clients gespeichert ist und mittels der SID ausgelesen werden könnte, oder? Bzw. mache ich da einen Denkfehler, fehlt mir eine entscheidende Info? Ist mir ja etwas peinlich, hab mich mit diesem Bereich wie gesagt bisher noch nicht sehr intensiv beschäftigt. :)
Wahrscheinlich auch ne doofe Frage ... könnte man dem Browser zum Anspringen des Tabs per Anker vielleicht irgendwie vorgaukeln, man käme von einem externen Link? An irgendwas muss das der Tab doch merken, also denke ich mir, es müsste was her, dieses "irgendwas" zu überschreiben.
... kein problem: Die Session-Variablen werden auf dem Server gespeichert unter der ID als "Wiedererkennung" - der Browser liefert die selbe ID, damit der Server auch die richtigen Daten an den richtigen browser ausgibt... ist wie beim Gaderobe abgeben mit Marke. Im Browser kann die ID z.B. als Cookie gespeichert werden oder in Form eines GET-Parameters. Die ID muss aber "zuverlässig" vom Browser an den Server. Guck mal zum Thema Session z.B. bei SelfPHP
:-) das ist halt Sache des Browsers... anscheinend sind die Standard-Implementierungen so, dass bei gleicher "URL" und unterschiedlichem Anker kein Reload stattfindet - was ja auch gut ist. GGf. müsste man mal prüfen, ob die JavaScript-Tab-Umschaltung nur bei Reload "zündet" und ggf. auf Click-Event umschaltet/ergänzt.
zonky
Okay, vielen Dank für die Info. Alles verstanden ... werd aber trotzdem ruhig nochmal bei selfPHP nachlesen.
Moin,
also das Öffnen eines Akkoredon-Elements per Anker-Wert fände ich auch eine gute Sache. Siehe unten.
Die Session würde ich nicht nutzen wollen/können: das Umschalten von Tabs bzw. Akkordeon-Elementen findet ja absichtlich OHNE Kommunikation mit dem Server statt (kein Reload). Es ist meiner Meinung nach auch die falsche Stelle, wozu sollte Contao darüber informiert werden, welchen Tab der Besucher gerade anschaut?
Session-Cookies werden auch, soweit mir bekannt, von Browsern akzeptiert, die persistente Cookies ablehnen (weil der Besucher das so eingestellt hat). Und für den hier diskutierten Zweck ist es meiner Meinung nach nicht erforderlich, das Cookie dauerhaft zu speichern, es geht wirklich nur um die aktuelle Session.
Das Problem mit Back/Formularen/Paginierungen haben nebenbei alle Web 2.0/AJAX Anwendungen (z.B. auch noch pk_noobSlide, ce_slide) ... deshalb gibt es auch generische Ansätze, dem beizukommen. Gerade habe ich z.B. den MooTools History-Manager gefunden. Ich lese gerade dessen Beschreibung, Ihr könnt ja mal das Beispiel dort in verschiedenen Browsern (vor allem unter Mac) testen, ob das ohne Reload funktioniert. Irgenwo hatte ich auch noch was gesehen, das mit HTML5 Features arbeitet, falls verfügbar, ansonsten aber auf location.hash downgraded, falls nötig.
Die Anker-Lösung im aktuellen [tabcontrol] funktioniert nebenbei nur bei echtem Reload, weil die Auswertung im Konstruktor von TabControl stattfindet (function initialize) und das Object ja bei domready erzeugt wird. Deshalb kann man nicht in einem Tab auf einen anderen verlinken und erwarten, das der dann aufgeht. Dazu gibt es aber zwei JS Funktionen: selectTab() und selectTabByIndex(). Ich werde aber mal schauen, ob ich daran auch was drehen kann.
LG, Georg
Hallo zusammen,
Hab keinen Mac. Aber meine Tochter (iBook, OS X, 6 Monate alt). Falls niemand von euch einen hat oder auftun kann, würde ich ihr eine Mail mit dem Link schicken und sie bitten, das mal für uns zu testen.Zitat:
... MooTools History-Manager gefunden. Ich lese gerade dessen Beschreibung, Ihr könnt ja mal das Beispiel dort in verschiedenen Browsern (vor allem unter Mac) testen, ob das ohne Reload funktioniert.
Gestestet hab ich eben unter Win XP mit FF3.6, FF4, Opera11, IE8. Das Verhalten der Browser war identisch.
Ergebnis:
Beim Wechsel auf die Tabs "Content 2" bis "Content 4" und zwischen denen kein Reload. Beim Zurückwechseln auf den Tab "Content 1" erfolgte jedoch in allen Browsern ein Reload.
Korrektur:
Bei einem späteren Test benahm sich der FF plötzlich brav und machte auch beim Rückwechseln auf den ersten Tab keinen Reload. Auch nachdem ich mal den Cache geleert und die Seite neu geladen hatte. Was da anders war als vorher, konnte ich nicht nachvollziehen und die URL-Parameter schauten auch genauso aus. Die anderen Browser machten dasselbe wie zuvor.
Spasseshalber änderte ich in den IE8-Einstellungen mal die Sicherheitsstufe auf "hoch". Erwartungsgemäß ging dann praktisch garnichts mehr. Die Buttons "Previous" und "Next" weiter oben auf der Seite außer Funktion und die Divs der Tab-Elemente unten wurden alle gleichzeitig untereinander angezeigt. Ist klar, weil bei dieser Stufe wohl auch Scripting deaktiviert ist. Was unabhängig vom aktuellen Vorhaben ganz allgemein Gedanken über Verwendung oder Nichtverwendung von Cookies etwas absurd erscheinen lässt, denn wer Javascript abschaltet, doch sehr wahrscheinlich auch Cookies - denke ich mir jedenfalls. Außerdem würde es in dem Fall auch keine Rolle spielen, weil dann Accordions und Tabs eh nicht funktionieren. Und umgekehrt, wer JS zulässt, vermutlich auch Cookies.
Das von luckyB unten in den Kommentaren der Seite beschriebene IE8-Problem trat bei mir mit dem IE8 nicht auf.
Ich kann auch nochmal mit Chrome testen, hab ich aber nur in einer VM und die hab ich dafür jetzt nicht extra gestartet.
Hab übrigens an mehreren Stellen nochmal nachgelesen und wenn man dem glauben darf ... Temporäre Session-Cookies werden im RAM des Client gespeichert. Wenn Cookies insgesamt verboten sind und nicht nach persistent oder temporär unterschieden wird, gehen jedoch beide Arten nicht. Bei näherem Nachdenken kann ich Dir überdies nur zustimmen - Sessions wären dafür doof, weil dann wohl in jedem Fall ein Reload passiert.Zitat:
Session-Cookies werden auch, soweit mir bekannt, von Browsern akzeptiert, die persistente Cookies ablehnen (weil der Besucher das so eingestellt hat). Und für den hier diskutierten Zweck ist es meiner Meinung nach nicht erforderlich, das Cookie dauerhaft zu speichern, es geht wirklich nur um die aktuelle Session.
Fazit: Eigentlich funktioniert diese MooTools-Lösung super. Bloß das mit dem ersten Tab ist unangenehm und ein Nachteil ggü. dem Default-Tabcontrol-Modul, wo nirgends ein Reload stattfindet. Außerdem beginnt die Seite danach wieder ganz oben. Nicht so toll, wenn das Tab-Dings weiter unten außerhalb des Viewports sitzt.
Moin,
im Anhang eine Alpha-Version der Cookie-Variante für TabControl. Ich konnte bisher ohne Patches auskommen und habe nur das Template "ce_tabcontrol_tab" geändert. Packt den Anhang aus und laded das *.tpl in Euren Template Ordner (passend zum Theme) hoch. Dann sollte es funktionieren.
LG, Georg
Wow sehr cool, gefällt mir ausgezichnet kann ich gleich mal brauchen :)
Moin Georg,
dankeschön!! Ich hab´s eben im BE "Templates - Neues Template" angelegt und den Code mit Deinem ersetzt. Richtig so, oder meintest Du den Template-Ordner im Filesystem und es dort zusätzlich unter neuem Namen speichern? Wobei mir jetzt nichts einfiele, weshalb das einen Unterschied machen sollte.
Eben mit Firefox getestet. Toll, bis auf einen Punkt funktioniert es schon bestens, auch mit einem Formular im Tab - nach einem Reload oder Rückkehr von einer anderen Seite ist immer der zuletzt offene Tab wieder geöffnet.
1 Fehler: Tritt der bei Dir nicht auf? Beim Klicken auf einen Reiter springt die Seite ganz nach oben und ich muss erst wieder runterscrollen. Mir aufgefallen, weil sich in der getesteten Seite die Tabcontrol-Elemente unten außerhalb des Viewports befinden. Die eine Gruppe sind 4 in Tabs untergebrachte Fotogalerien und ansonsten sind die Kommentare in Tabs. Kommentare und Formular im ersten, im zweiten Verwendungshinweise.
Anhang 4600 Anhang 4601
Zwar glaube ich kaum, dass der unerwünschte Sprung zum Seitenanfang als Nebeneffekt von dieser individuellen Besonderheit bei mir verursacht wird, doch ich erwähne es besser: Außerdem hab ich in beiden Tab-Gruppen als letzten einen "X"-Reiter ohne Inhalt im zugehörigen Tab. Weil der inhaltslos ist, bringt mir das die nützliche Zusatzfunktionalität, beim Klicken darauf die ganze Gruppe bis auf die Reiter-Zeile auszublenden. Finde ich sehr praktisch, so kann man z. B. die Kommentare unten bis auf die Kopfzeile komplett ausblenden.
Wünsch Dir einen erfolgreichen Tag ...
HG Andreas