Php tableau div/css

Pook -

Bonjour,
debutant en php je viens de commencer a coder un tableau dynamique avec des div et du css, dans ce tableau j'affiche un certain nombre d'éléments récupéré de ma bdd, seulement voilà:
- j'aimerais obtenir ce resultat:
<div id="conteneurtableau">
<div id="lignes" style="clear: both;">
<div id="colonnes" style="float: left;">News1</div>
<div id="colonnes" style="float: left;">News2</div>
<div id="colonnes" style="float: left;">News3</div>
<div id="colonnes" style="float: left;">News4</div>
</div>

et j'obtiens ceci:

<div id="conteneurtableau">
<div id="lignes" style="clear: both;">
<div id="colonnes" style="float: left;">News1 News2 News3 News4</div>
<div id="colonnes" style="float: left;">News1 News2 News3 News4</div>
<div id="colonnes" style="float: left;">News1 News2 News3 News4</div>
<div id="colonnes" style="float: left;">News1 News2 News3 News4</div>
</div>

voici mon code:

<div id="conteneurtableau">
<?php
for ($r=1; $r<=$NbrLignes; $r++){
echo'<div id="lignes" style="clear:both;">';
for ($c=1; $c<=($NbrColonnes); $c++){
echo'<div id="colonnes" style="float:left;">';
foreach ($list as $item) :
echo $item->title;
endforeach;
echo '</div>';
}
echo '</div>';
}

?>

</div>

Pouvez-vous m'aider s'il vous plait ? Tout type d'interventions de votre part est la bienvenue. Merci d'avance à vous.

Afficher la suite

A voir également

Php tableau div/css
Tableau word - Guide
Trier tableau excel - Guide
Imprimer un tableau excel - Guide
Tableau croisé dynamique - Guide
Expert php - Télécharger - Langages

6 réponses

Pook

Re bonjour, j'ai fini par trouver la solution à mon probleme, merci encore : )

Je la donne pour ceux que ça interesse:

<?php
$colonne = 0;
$newline = '<div class="lignes" style="clear:both;">';
 
echo $newline;
 
foreach ($list as $item) {
 
if ($colonne >= $NbrColonnes) {
   $colonne = 1;
   echo "</div>\n" . $newline;
}
else {
  $colonne++;
}
 
echo '<div class="colonnes" style="float:left;">'.$item->title.'</div>';
 
}
 
echo "</div>\n";
?>

Pook

Bonjour Anoen, resultat du test avec ta propostion:

<div id="lignes" style="clear: both;">
<div class="colonnes" style="float: left;">News1</div>
<div class="colonnes" style="float: left;">News2</div>
<div class="colonnes" style="float: left;">News3</div>
<div class="colonnes" style="float: left;">News4</div>
</div>
<div id="lignes" style="clear: both;">
<div class="colonnes" style="float: left;">News1</div>
<div class="colonnes" style="float: left;">News2</div>
<div class="colonnes" style="float: left;">News3</div>
<div class="colonnes" style="float: left;">News4</div>
</div>

entretemps j'ai essayé ceci, qui marche "presque" parfaitement:

<?php
$colonne = 1;
$newline = '<div class="lignes" style="clear:both;">';
 
echo $newline;
 
foreach ($list as $item) {
 
if ($colonne > $NbrColonnes) {
   $colonne = 1;
   echo "</div>\n" . $newline;
}
else {
  $colonne++;
}
 
echo '<div class="colonnes" style="float:left;">'.$item->title.'</div>';
 
}
 
echo "</div>\n";
?>

- Si ce n'est que le resultat est un peu bizarre:

<div id="lignes" style="clear: both;">
<div class="colonnes" style="float: left;">News1</div>
<div class="colonnes" style="float: left;">News2</div>
</div>
<div id="lignes" style="clear: both;">
<div class="colonnes" style="float: left;">News3</div>
<div class="colonnes" style="float: left;">News4</div>
<div class="colonnes" style="float: left;">News5</div>
</div>
<div id="lignes" style="clear: both;">
<div class="colonnes" style="float: left;">News6</div>
<div class="colonnes" style="float: left;">News7</div>
<div class="colonnes" style="float: left;">News8</div>
</div>
<div id="lignes" style="clear: both;">
<div class="colonnes" style="float: left;">News9</div>
<div class="colonnes" style="float: left;">News10</div>
</div>

Merci encore : )

Réponse 3 / 6
Anoen
Effectivement, je pense que c'est parce que tu as 2 for, le foreach récupère déjà tes colonnes mais ton for juste avant les multiplient.
Le foreach va parcourir ta bdd et renvoyer tous les résultats correspondants à la requête un par un, tu n'as pas besoin de l'inclure dans une boucle supplémentaire pour créer tes colonnes il le fera tout seul.
```
<?php 
for ($r=1; $r<=$NbrLignes; $r++){
echo'<div class="lignes" style="clear:both;">';
foreach ($list as $item) :
echo '<div class="colonnes" style="float:left;">'.$item->title.'</div>';
endforeach;
echo '</div>';
}
```
Ca devrait être bon avec ça, dis moi si tu as un problème ;)
0

Pook

Merci ! Ta proposition marche, mais enfaite ça ne resout pas tout parceque j'ai omis des point important dans le post:

-j'essaie enfaite de faire un systeme de tableau comme tu l'a bien compris mais ou je definis moi-même le nombre de lignes et de colonnes.

voici ce que j'ai cette fois-ci:

<?php 
for ($r=1; $r<=$NbrLignes; $r++){
echo'<div class="lignes" style="clear:both;">';
for ($c=1; $c<=($NbrColonnes); $c++){
foreach ($list as $item) :
echo '<div class="colonnes" style="float:left;">'.$item->title.'</div>';
endforeach;
}
echo '</div>';
}
 
?>

avec mes variables $NbrLignes=2 et $NbrColonnes=4

j'obtient comme résultat mes colonnes multiplié par 4,

<div id="conteneurtableau">
<div class="lignes" style="clear: both;">
<div class="colonnes" style="float: left;">News1</div>
<div class="colonnes" style="float: left;">News2</div>
<div class="colonnes" style="float: left;">News3</div>
<div class="colonnes" style="float: left;">News4</div>
<div class="colonnes" style="float: left;">News1</div>
<div class="colonnes" style="float: left;">News2</div>
<div class="colonnes" style="float: left;">News3</div>
<div class="colonnes" style="float: left;">News4</div>
<div class="colonnes" style="float: left;">News1</div>
<div class="colonnes" style="float: left;">News2</div>
<div class="colonnes" style="float: left;">News3</div>
<div class="colonnes" style="float: left;">News4</div>
<div class="colonnes" style="float: left;">News1</div>
<div class="colonnes" style="float: left;">News2</div>
<div class="colonnes" style="float: left;">News3</div>
<div class="colonnes" style="float: left;">News4</div>
</div>
<div class="lignes" style="clear: both;">
<div class="colonnes" style="float: left;">News1</div>
<div class="colonnes" style="float: left;">News2</div>
<div class="colonnes" style="float: left;">News3</div>
<div class="colonnes" style="float: left;">News4</div>
<div class="colonnes" style="float: left;">News1</div>
<div class="colonnes" style="float: left;">News2</div>
<div class="colonnes" style="float: left;">News3</div>
<div class="colonnes" style="float: left;">News4</div>
<div class="colonnes" style="float: left;">News1</div>
<div class="colonnes" style="float: left;">News2</div>
<div class="colonnes" style="float: left;">News3</div>
<div class="colonnes" style="float: left;">News4</div>
<div class="colonnes" style="float: left;">News1</div>
<div class="colonnes" style="float: left;">News2</div>
<div class="colonnes" style="float: left;">News3</div>
<div class="colonnes" style="float: left;">News4</div>
</div>
</div>

alors que ce que je voudrais vraiment à la fin c'est quelque chose dans cette idee là :

<div id="lignes" style="clear: both;">
<div class="colonnes" style="float: left;">News1</div>
<div class="colonnes" style="float: left;">News2</div>
<div class="colonnes" style="float: left;">News3</div>
<div class="colonnes" style="float: left;">News4</div>
</div>
<div id="lignes" style="clear: both;">
<div class="colonnes" style="float: left;">News5</div>
<div class="colonnes" style="float: left;">News6</div>
<div class="colonnes" style="float: left;">News7</div>
<div class="colonnes" style="float: left;">News8</div>
</div>

J'espère être suffisament clair et encore merci pour ta réponse : )

Vous n’avez pas trouvé la réponse que vous recherchez ?

La communauté CCM répond en moyenne en moins de 2h.

Posez votre question
Réponse 5 / 6
Pook
Merci pour ta reponse anoen, mais j'ai un autre souci maintenant x D, le résultat est multiplie par le nombre de colonnes ?

ca donne ca:
<div id="colonnes" style="float: left;">News1</div>
<div id="colonnes" style="float: left;">News2</div>
<div id="colonnes" style="float: left;">News3</div>
<div id="colonnes" style="float: left;">News4</div>
<div id="colonnes" style="float: left;">News1</div>
<div id="colonnes" style="float: left;">News2</div>
<div id="colonnes" style="float: left;">News3</div>
<div id="colonnes" style="float: left;">News4</div>
<div id="colonnes" style="float: left;">News1</div>
<div id="colonnes" style="float: left;">News2</div>
<div id="colonnes" style="float: left;">News3</div>
<div id="colonnes" style="float: left;">News4</div>
<div id="colonnes" style="float: left;">News1</div>
<div id="colonnes" style="float: left;">News2</div>
<div id="colonnes" style="float: left;">News3</div>
<div id="colonnes" style="float: left;">News4</div>

et quand j'ajoute par exemple la valeur 2 à la variable $NbrLignes il me multiplie le résultat ci-dessus par 2:

<div id="lignes" style="clear: both;">
<div id="colonnes" style="float: left;">News1</div>
<div id="colonnes" style="float: left;">News2</div>
<div id="colonnes" style="float: left;">News3</div>
<div id="colonnes" style="float: left;">News4</div>
<div id="colonnes" style="float: left;">News1</div>
<div id="colonnes" style="float: left;">News2</div>
<div id="colonnes" style="float: left;">News3</div>
<div id="colonnes" style="float: left;">News4</div>
<div id="colonnes" style="float: left;">News1</div>
<div id="colonnes" style="float: left;">News2</div>
<div id="colonnes" style="float: left;">News3</div>
<div id="colonnes" style="float: left;">News4</div>
<div id="colonnes" style="float: left;">News1</div>
<div id="colonnes" style="float: left;">News2</div>
<div id="colonnes" style="float: left;">News3</div>
<div id="colonnes" style="float: left;">News4</div>
</div>
<div id="lignes" style="clear: both;">
<div id="colonnes" style="float: left;">News1</div>
<div id="colonnes" style="float: left;">News2</div>
<div id="colonnes" style="float: left;">News3</div>
<div id="colonnes" style="float: left;">News4</div>
<div id="colonnes" style="float: left;">News1</div>
<div id="colonnes" style="float: left;">News2</div>
<div id="colonnes" style="float: left;">News3</div>
<div id="colonnes" style="float: left;">News4</div>
<div id="colonnes" style="float: left;">News1</div>
<div id="colonnes" style="float: left;">News2</div>
<div id="colonnes" style="float: left;">News3</div>
<div id="colonnes" style="float: left;">News4</div>
<div id="colonnes" style="float: left;">News1</div>
<div id="colonnes" style="float: left;">News2</div>
<div id="colonnes" style="float: left;">News3</div>
<div id="colonnes" style="float: left;">News4</div>
</div>

- alors que ce que je voudrais vraiment à la fin c'est quelque chose dans cette idee là :

<div id="lignes" style="clear: both;">
<div id="colonnes" style="float: left;">News1</div>
<div id="colonnes" style="float: left;">News2</div>
<div id="colonnes" style="float: left;">News3</div>
<div id="colonnes" style="float: left;">News4</div>
</div>
<div id="lignes" style="clear: both;">
<div id="colonnes" style="float: left;">News5</div>
<div id="colonnes" style="float: left;">News6</div>
<div id="colonnes" style="float: left;">News7</div>
<div id="colonnes" style="float: left;">News8</div>
</div>

Merci d'avance : )
0

Anoen

Bonjour,
Il faut que tu ferme ta div dans le foreach :)

for ($c=1; $c<=($NbrColonnes); $c++){
foreach ($list as $item) :
echo '<div id="colonnes" style="float:left;">'.$item->title.'</div>';
endforeach;
}

Php tableau div/css

6 réponses

Discussions similaires

Newsletters