[PHP] li sorteren

[console]

Dag here,

Momenteel ben ik met een site bezig, waar ik uit een tabel informatie haal met namen. Nu wil ik deze namen sorteren op alfabet. Maar dit moet ik één enkele 'ul' lijst en er zijn standaard 3 rijen. De 'li' heeft een float:left!

Voorbeeld;

De volgende normale list zou ze naast elkaar zetten.

code:

<ul>
<li>aa</li>
<li>ab</li>
<li>ac</li>
<li>ba</li>
<li>bb</li>
<li>bc</li>
<li>ca</li>
<li>cb</li>
<li>cc</li>
</ul>

Maar de structuur van de list moet zo worden, dan worden de namen netjes onderelkaar gezet op alfabet

code:

<ul>
<li>aa</li>
<li>ba</li>
<li>ca</li>
<li>ab</li>
<li>bb</li>
<li>cb</li>
<li>ac</li>
<li>bc</li>
<li>vc</li>
</ul>

^{(elk - is een nieuwe li )}

Eerlijk gezegt heb ik geen flauw idee hoe ik dit het beste voor mekaar kan krijgen Zou fijn zijn als iemand me een duw in de goede richting kan geven hoe ik dit op kan lossen.

[Guillome]

Hoe sorteer je? Ik zie ASC en DESC verschillend gebruikt worden

[console]

Guillome schreef op woensdag 31 maart 2010 @ 16:01:
Hoe sorteer je? Ik zie ASC en DESC verschillend gebruikt worden

ASC. De eerste voorbeeld is hoe ik nu heb, maar moet voorbeeld 2 worden. Want de li heeft een float:left; dus zet alles naast elkaar maar word afgekapt door de div breedte zodat je elke keer een rij van 3 namen naast elkaar hebt.

[Orion84]

Volgens mij gaat het helemaal niet specifiek om het sorteren, maar worden de li's gewoon in een andere formatie worden weergegeven dan gewenst.

Je hebt de Li's al in gesorteerde volgorde, maar als je ze een float left geeft dan krijg je dus het linkervoorbeeld als ik het goed begrijp, terwijl je eigenlijk wilt dat ze geordend worden zoals in het rechter voorbeeld? Dus drie kolommen, in plaats van 3 regels?

Kortom: je wilt de li's onder elkaar hebben en zodra de onderkant van de DIV bereikt is, wil je dat ie in een tweede kolom verder gaat en daarna een derde?

Dat ze nu naast elkaar komen komt in elk geval door die float:left, lijkt me. Hoe je met CSS iets over meerdere kolommen kan uitsmeren zou ik niet weten, daarvoor heb ik te weinig kaas gegeten van CSS

[ Voor 30% gewijzigd door Orion84 op 31-03-2010 16:08 ]

[dev10]

Je kunt gewoon de eerste structuur van je lijst houden, maar dan moet je opdelen na 3 li's.

Dan krijg je dus iets als:

HTML:

<ul style="float: left">
  <li>aa</li>
  <li>ab</li>
  <li>ac</li>
</ul>
<ul style="float: left">
  <li>aa</li>
  <li>ab</li>
  <li>ac</li>
</ul>

edit:
Wat Orion84 zegt dus

Met PHP kun je wel een loopje maken dat na drie li's de lijst afbreekt en er een nieuwe lijst inzet.

[ Voor 4% gewijzigd door dev10 op 31-03-2010 16:06 ]

[Orion84]

@dev10: dat kan inderdaad ook. Maar werkt alleen als je weet hoeveel regels je kwijt kan. Ik vermoed echter dat de hoogte van de DIV afhankelijk is van het aantal items, en dat alleen de breedte vast staat?

Dat is ook wel in PHP op te lossen, door de array te splitsen in 3 array's, eentje per kolom. Waarbij je dus item 1 naar array1 verplaatst, item 2 naar array2, item 3 naar array3, item 4 weer naar array1 etc. Daarna vul je de linker UL met array 1, de middelste met array2 en de rechtse met array3.

Edit: of wat pino zegt inderdaad, dat is wat efficienter: Pin0 in "[PHP] li sorteren"

[ Voor 52% gewijzigd door Orion84 op 31-03-2010 16:13 ]

[console]

dev10 schreef op woensdag 31 maart 2010 @ 16:05:
Je kunt gewoon de eerste structuur van je lijst houden, maar dan moet je opdelen na 3 li's.

Dan krijg je dus iets als:

HTML:

<ul style="float: left">
  <li>aa</li>
  <li>ab</li>
  <li>ac</li>
</ul>
<ul style="float: left">
  <li>aa</li>
  <li>ab</li>
  <li>ac</li>
</ul>

edit:
Wat Orion84 zegt dus

Met PHP kun je wel een loopje maken dat na drie li's de lijst afbreekt en er een nieuwe lijst inzet.

Die manier van jou had ik ook al in mijn hoofd, maar het moet mogelijk zijn om in één 'list' de gewenste resultaat te krijgen wat ik wil.

[ Voor 42% gewijzigd door console op 31-03-2010 16:11 ]

[Pin0]

Ja, het komt er op neer het totaal aantal namen te delen door drie (aantalKolommen) en vervolgens als dat aantal bereikt is (totaalAantal/aantalKolommen) de ul afsluiten en opnieuw openen voor de volgende lijst...

[HMS]

Je zou het met XSL / XSLT kunnen proberen

(http://www.w3schools.com/xsl/el_sort.asp)

[Orion84]

Voor een CSS multi column oplossing moet je zo te zien iig nog even wachten:
http://www.w3.org/TR/2001/WD-css3-multicol-20010118/

Als je het per se in één UL wilt hebben, dan zou je eventueel mijn oplossing kunnen gebruiken. Dus per kolom opsplitsen in aparte arrays en dan de UL als volgt vullen:

item1 uit array1
item1 uit array2
item1 uit array3
item2 uit array1
...

[ Voor 55% gewijzigd door Orion84 op 31-03-2010 16:17 ]

[NetForce1]

Als je makkelijk op de server al kan bepalen hoeveel kolommen je hebt, en hoe lang die zijn, kun je daar al sorteren op naam, dan verdelen over het aantal kolommen, en daarna de items in gewenste volgorde weer samenvoegen.

edit:
te laat, niet zo lang denken over je post...

[ Voor 11% gewijzigd door NetForce1 op 31-03-2010 16:19 ]

[console]

Orion84 schreef op woensdag 31 maart 2010 @ 16:15:
Voor een CSS multi column oplossing moet je zo te zien iig nog even wachten:
http://www.w3.org/TR/2001/WD-css3-multicol-20010118/

Als je het per se in één UL wilt hebben, dan zou je eventueel mijn oplossing kunnen gebruiken. Dus per kolom opsplitsen in aparte arrays en dan de UL als volgt vullen:

item1 uit array1
item1 uit array2
item1 uit array3
item2 uit array1
...

Yep, inderdaad dat is hem! Het is ook zo simpel, maar op een gegeven moment zie je het eff niet meer als je de heledag aan het PHPén ben