PHP/MYSQL - tabel maximaal 4 kolommen naast elkaar

[Maverick2001]

Ik ben bezig met een agenda script waarbij ik een soort van kalender krijg. Het is de bedoeling dat er in de tabel 4 kolommen worden weergegeven waarna hij vervolgens op de nieuwe rij begint.

Ik heb de breedte van de tabel op 500 gezet waamee ik dacht dat hij dan automatisch wel op de volgende regel gaat beginnen. Maar in werkelijkheid plakt hij ze toch allemaal op 1 rij.

De gegevens inclusief de achtergrond van de cel worden uit een database gehaald.

PHP:

echo "\n<td background=$achtergrond>$edatum<br>$plaats<br>$omschrijving<br>$locatie<br>$tijd<br>$concert</td>";

De vraag is in het kort hoe ik het voorelkaar krijg dat ik maximaal 4 kolommen krijg.

[Creepy]

Kan je misschien eens laten zien hoe je de tabel genereerd? Ik zie dat je nu alleen een <td> genereert en als je dit in een loopje hebt zitten dan krijg je alles achter elkaar omdat je geen <tr> tags genereert. De breedte van de tabel heeft hier (nog) niks mee te maken.

[Voutloos]

Zet voor elke 1e cel een <tr>. Zet na elke 4e cel een </tr>. Klaar.

[Maverick2001]

Creepy schreef op maandag 14 mei 2007 @ 17:26:
Kan je misschien eens laten zien hoe je de tabel genereerd? Ik zie dat je nu alleen een <td> genereert en als je dit in een loopje hebt zitten dan krijg je alles achter elkaar omdat je geen <tr> tags genereert. De breedte van de tabel heeft hier (nog) niks mee te maken.

PHP:

    $xx=mysql_query("SELECT agenda.*, DATE_FORMAT(edatum, '%d-%m-%Y') AS ddatum, concerten.concert, concerten.achtergrond FROM agenda, concerten WHERE edatum >= curdate()AND agenda.concert = concerten.concert ORDER BY edatum ASC");
    while ($row = mysql_fetch_array($xx))
    {
        $id = $row["id"];
        $omschrijving = $row["omschrijving"];
        $edatum = $row["edatum"];
        $locatie = $row["locatie"];
        $plaats = $row["plaats"];
        $tijd = $row["tijd"];
        $edatum = $row["ddatum"];
        $datumvandaag = date('d-m-Y');
        $concert =$row["concert"];
        $achtergrond = $row["achtergrond"];

Zit inderdaad een loop in. Ik gebruikte ditzelfde verhaal eerder voor het weergeven van tekst in rijen, dan was het geen enkel probleem met tr-tags.

[sky-]

Tip ,

Ga niet zomaar (wat je nu dus doet) variabelen in variabelen gooien, dit kost je preformance.

[djluc]

Je kan het ook zonder tabel doen (aangezien het een lijst is met datums) op de volgende manier:

Cascading Stylesheet:

ul {
  width: 500px;
}
li {
  width: 120px;
  float: left;
}

HTML:

<ul>
  <li>1</li>
  <li>2</li>
  <li>3</li>
  <li>4</li>
  <li>5</li>
</div>

Verder een erg boeiend topic over dit onderwerp:
[css] agenda weergave

[Maverick2001]

k8skaaay schreef op maandag 14 mei 2007 @ 17:31:
Tip ,

Ga niet zomaar (wat je nu dus doet) variabelen in variabelen gooien, dit kost je preformance.

Bedankt voor de tip en begrijp dat dit ff offtopic gaat maar hoe bedoel je 'variabelen in variabelen gooien'

[Maverick2001]

djluc schreef op maandag 14 mei 2007 @ 17:32:
Je kan het ook zonder tabel doen (aangezien het een lijst is met datums) op de volgende manier:

Cascading Stylesheet:

ul {
  width: 500px;
}
li {
  width: 120px;
  float: left;
}

HTML:

<ul>
  <li>1</li>
  <li>2</li>
  <li>3</li>
  <li>4</li>
  <li>5</li>
</div>

Verder een erg boeiend topic over dit onderwerp:
[css] agenda weergave

Dit werkt inderdaad wel echter moet de achtergrond van de cel ook dynamisch zijn. Hij haalt de achtergrond ook uit de database... en zoals ik het nu zie krijg ik niet een achtergrond.

[djluc]

Je kan dat doen met een simpele inline style op de li tags: <li style="background: achtergrond;"> maar het is mooier om het met classes te doen (als je bijvoorbeeld elk weekend wilt kleuren).

<li class="maandag">
| etc
<li class="vrijdag">
<li class="zaterdag weekend">
<li class="zondag weekend">

Dan kan je simpel in je css het weekend groen kleuren bijvoorbeeld:

Cascading Stylesheet:

li.weekend {
  background-color: green;
}

[sky-]

Wat ik bedoel is wat je nu doet :

PHP:

<?php
$var = $_POST['var']; 

echo $var;
?>

Hier schiet je namelijk niets mee op, want je echo't gewoon $_POST['var'] dan als het ware. (Dit is echter een van de vele duizenden voorbeelden.)

Dat wat je doet is alleen makkelijk wanneer je er iets mee gaat doen, maar dan zou het nog zo kunnen bijv :

PHP:

<?php
$tekst = nl2br($_POST['tekst']);
?>

Nu moet ik wel zeggen, normaal gooi je ook geen ruwe post waarden ergens in, omdat je er niet altijd vanuit kan gaan dat je POST waarden goed zijn.

Btw, haal die variabelen eens buiten quotes..

PHP:

<?php
echo $var.$var2.$var3; // etc
// ipv dus :
echo "$var $var2 $var3"; // etc..
?>

[ Voor 23% gewijzigd door sky- op 14-05-2007 18:12 ]

[Maverick2001]

djluc schreef op maandag 14 mei 2007 @ 18:08:
Je kan dat doen met een simpele inline style op de li tags: <li style="background: achtergrond;"> maar het is mooier om het met classes te doen (als je bijvoorbeeld elk weekend wilt kleuren).

<li class="maandag">
| etc
<li class="vrijdag">
<li class="zaterdag weekend">
<li class="zondag weekend">

Dan kan je simpel in je css het weekend groen kleuren bijvoorbeeld:

Cascading Stylesheet:

li.weekend {
  background-color: green;
}

Dit is wel mooi maar hij haalt per genre een andere achtergrond (afbeelding) uit de database). In CSS kan ik niet een $ aanroepen.

[Maverick2001]

Denk dat het nu helemaal van de basis van mijn probleem afgaat.. Het gaat mij er juist uit dat ik per item een achtergrond uit de tabel (mysql)kan halen.

De 'li/ul' oplossing biedt die mogelijkheid niet.

[Verwijderd]

Kijk naar de oplossing van Voutloos.
Bovendien ben je vergeten } te sluiten:

PHP:

<?php
    $xx=mysql_query("SELECT agenda.*, DATE_FORMAT(edatum, '%d-%m-%Y') AS ddatum, concerten.concert, concerten.achtergrond FROM agenda, concerten WHERE edatum >= curdate()AND agenda.concert = concerten.concert ORDER BY edatum ASC");
    while ($row = mysql_fetch_array($xx))
    {
        $id = $row["id"];
        $omschrijving = $row["omschrijving"];
        $edatum = $row["edatum"];
        $locatie = $row["locatie"];
        $plaats = $row["plaats"];
        $tijd = $row["tijd"];
        $edatum = $row["ddatum"];
        $datumvandaag = date('d-m-Y');
        $concert =$row["concert"];
        $achtergrond = $row["achtergrond"];
!!! HIER HOORT } TE STAAN !!!
?>

[Creepy]

Die code was niet volledig. Als er daar wel een } zou staan dan overschrijf je steeds dezelfde variabelen in een loop, niet echt nuttig

[Maverick2001]

Verwijderd schreef op maandag 14 mei 2007 @ 19:46:
Kijk naar de oplossing van Voutloos.

Sorry maar dat is toch niet de oplossing? Ik wil vier kolommen naastelkaar hebben.

[djluc]

Maverick2001 schreef op maandag 14 mei 2007 @ 19:13:
Denk dat het nu helemaal van de basis van mijn probleem afgaat.. Het gaat mij er juist uit dat ik per item een achtergrond uit de tabel (mysql)kan halen.

De 'li/ul' oplossing biedt die mogelijkheid niet.

Dat kan wel?!

PHP:

//.......
while($row=mysql_fetch_assoc($result)) {
  echo '<li style="background-image: url('.$row['image'].')">'.$row['id'].'</li>';
}

[user109731]

Maverick2001 schreef op maandag 14 mei 2007 @ 20:05:
[...]
Sorry maar dat is toch niet de oplossing? Ik wil vier kolommen naastelkaar hebben.

En hoe voorkom je dat er een 5e kolom bijkomt? Juist, door de huidige rij af te sluiten en een nieuwe te beginnen... Een tabel is voor tabulaire data, je kunt niet verwachten dat een browser dat zelf in rijen en kolommen gaat opdelen, en cellen naar onder gaat floaten: dat zou een chaos worden wanneer je tabellen wel gebruikt waar ze voor bedoeld zijn

Maar niet doen dus, de genoemde ul/li icm. floats is hier een prima oplossing voor. Bovendien heb je dan ook de mogelijkheid om snel meer items op 1 regel te zetten met enkel CSS, of om het aantal blokken-per-regel dynamisch te maken. Naast betere semaniek ben je dus ook flexibeler

[ Voor 11% gewijzigd door user109731 op 14-05-2007 20:31 ]

[Maverick2001]

djluc schreef op maandag 14 mei 2007 @ 20:12:
[...]
Dat kan wel?!

PHP:

//.......
while($row=mysql_fetch_assoc($result)) {
  echo '<li style="background-image: url('.$row['image'].')">'.$row['id'].'</li>';
}

Je hebt gelijk dat kan inderdaad. ik de tag voor de row verkeerd gezet in mijn test met de Li-Style.
Zo komt het er perfect uit te zien! Thnx