Array in 3 Listen aufteilen

kris29 · 23. September 2011 22:56

Ich hab ein einfaches Modul mit dem CTL-Modulmaker erstellt welches eine lange Liste von kurzen Einträgen ausgibt. Diese Liste soll nun im Layout in drei Spalten nebeneinander aufgeteilt werden, um Platz optimal auszunutzen.

Wie stellt man das an?
Viel weiter als die Anzahl aller Einträge abfragen komme ich nicht sad

Hier klicken, um den Code zum Kopieren zu markieren

{assign var='anzahl' value=$itemlist|@count}
Die Anzahl aller Einträge: {$anzahl}

Weiß jemand Rat?
Da ich mit Smarty/PHP nicht soviel Ahnung habe, hab ich auch schon darüber nachgedacht mittels jQuery die Liste zu splitten (list splitter). Aber direkt vom Template generiert würde es mir besser gefallen.

NaN · 23. September 2011 23:23

Wenn die Einträge die gleiche Höhe haben, kannst Du sie in der Breite doch einfach 33% breit sein und links floaten lassen:

Hier klicken, um den Code zum Kopieren zu markieren

.items {
    float:left;
    height: eine bestimmte Höhe px;
    width: 33%;
}

Thema erledigt.
Dann musst du nicht mal wissen wieviele es sind oder irgendwie rumrechnen.

kris29 · 23. September 2011 08:11

Da hab ich mich falsch ausgedrückt. Der Inhalt soll auf 3 Spalten verteilt werden (column layout). Eine Spalte ist demnach maximal mit einem Drittel aller items gefüllt.

Die normale Ausgabe der foreach-Schleife

Hier klicken, um den Code zum Kopieren zu markieren

{if $itemcount > 0}
<ul>
{foreach from=$itemlist item="item"}
<li>
Name: <h3>{$item->name}</h3>
Beschreibung: {$item->beschreibung}
</li>
{/foreach}
</ul>
{/if}

sieht so aus:

item1
item2
item3
item4
item5
item6
item7
item8
item9

und so möchte ich:

Für den Fall wenn es mal nicht soviele items gibt, dann wäre eine minimal-items-Angabe sinnvoll. Hier z.B. 3 Stück pro Liste:

Wo ich nicht weiterkomme ist, wie ich mit Smarty sage dass es bei der foreach-Schleife items nach Anzahl-x in eine neue Spalte packt (neue Liste ul, li).

Wenn irgendwann CSS3 in allen Browsern angekommen ist, würde ich das über CSS multi column lösen.

Beitrag geändert von kris29 (23. September 2011 08:11)

nockenfell · 23. September 2011 08:34

Hm, das kannst du allenfalls auch mit einem Mehrfach aufruf des Arrays erreichen.

Siehe:
http://www.blattertech.ch/blog/9/70/Sma … leifen.htm

Mittels

Hier klicken, um den Code zum Kopieren zu markieren

{$smarty.foreach.foo.index}

Weisst du wo du bist. Mittels count kannst du du Anzahl der Datensätze auslesen und damit dann eine section Schleife bauen in welcher du die Spalten aufbaust
http://support.zikula.de/module-News-di … id-800.htm

Mittels break bzw. continue kannst du dann steuern wann du welche Datensätze anzeigen willst.

Ist im Moment ein wenig wirr, da ich zuwenig Zeit habe das ganze Konzept sauber durch zu denken, es soll dir aber einen Ansatz geben wo du suchen kannst.

piratos · 23. September 2011 10:58

Drei Spalten nebeneinander das geht nur mit CSS.

1. ermitteln wie viele Inhalte man hat
2. ermitteln wie viele Inhalte pro Spalte kommen werden und ein Maximum pro Spalte definieren
3. in der Hauptschleife einen Counter starten und abfragen ob der das Spaltenmaximum erreicht hat, wenn ja z.B. ein DIV beenden und das nächste starten, Counter neu setzen

kris29 · 23. September 2011 20:31

Danke euch. Also mit smarty gestaltet sich das für mich nicht so easy. Habe es nun mit jQuery columnize gelöst. War sehr einfach einzubinden.

Von der Semantik ist es sogar besser so, als wenn nur zum Layoutzweck Inhalt einer Liste in mehrere Listen direkt im HTML verteilt wird.

PS: Die reine CSS-Lösung kam mangels IE-Unterstützung leider nicht in Frage.

Forum für CMS/made simple

#1 23. September 2011 22:56

Array in 3 Listen aufteilen

#2 23. September 2011 23:23

Re: Array in 3 Listen aufteilen

#3 23. September 2011 08:11

Re: Array in 3 Listen aufteilen

#4 23. September 2011 08:34

Re: Array in 3 Listen aufteilen

#5 23. September 2011 10:58

Re: Array in 3 Listen aufteilen

#6 23. September 2011 20:31

Re: Array in 3 Listen aufteilen

Fußzeile des Forums