Portfolio en grille avec jQuery en PHP

Mass22
PHP

Salut,

Voila je rencontre un petit problème avec le tuto portfolio en grille avec jQuery

Ce que je veux

J'utilise Laravel pour mon futur portfolio.
J'essaye de boucler mes réalisations dans des div au max de 4 par row mais je ne sais pas comment boucler pour avoir 4 réalisations max par row. L'idée étant que tout continue de fonctionner en rajoutant des réalisations au fur et à mesure.

exemple

<div class="project-row">
@foreach($reals as $real)

    <div class="project">{{ $real->name }}</div>

@endforeach
</div>

Avec pour résultat quelque chose comme : 

<div class="project-row">
    <div class="project">projet-1</div>
    <div class="project">projet-2</div>
    <div class="project">projet-3</div>
    <div class="project">projet-4</div>
</div>
<div class="project-row">
    <div class="project">projet-5</div>
    <div class="project">projet-6</div>
    <div class="project">projet-7</div>
    <div class="project">projet-8</div>
</div>
...

J'ai vu plusieurs questions sur le forum à ce sujet mais aucune réponse.

Pouvez-vous m'aider ?

Merci

6 réponses

SLK
Réponse acceptée

Ah moi j'en ai aucune foutu idée xD

Je ne connais pas DU TOUT Laravel,
j'ai cru que c'était un truc de Laravel,
j'ai juste recopié bêtement la façon de faire de Mass22 ^^

Du coup j'imagine qu'il faut rajouter les echo aussi.

En plus je me rends compte que je répète 3 fois <div class="project">{{ $real->name }}</div>,
j'aime pas trop, du coup peut-être ça à la place :

<?php
$counter = 1;

foreach ($reals as $real)
{
    if ($counter == 1)
    {
        echo '<div class="project-row">';
    }

    echo '<div class="project">' . {{ $real->name }} . '</div>';

    if ($counter == 4)
    {
        echo '</div>';
        $counter = 1;
    }
    else
    {
        $counter++;
    }
}

if ($counter != 1)
{
    echo '</div>';
}
?>

C'est plus clair.

SLK

Salut,

Une solution pourrait être de rajouter un compteur, et des conditions :

<?php
$counter = 1;

@foreach($reals as $real)
    if ($counter == 4)
    {
            <div class="project">{{ $real->name }}</div>
        </div>

        $counter = 1;
    }
    else
    {
        if ($counter == 1)
        {
            <div class="project-row">
                <div class="project">{{ $real->name }}</div>
        }
        else // $counter == 2 || $counter == 3
        {
            <div class="project">{{ $real->name }}</div>
        }

        $counter++;
    }
@endforeach
?>
AlexJM

@SLK, juste une petite question, les @ c'est une nouvelle syntaxe ou tu as confondu avec du blade ? (juste pour être sûr ^^')

Mass22
Auteur

@SLK : Super ça fonctionne ! Merci !!

@AlexJM : Oui c'est du blade (pour Laravel)

SLK

Hum,
tiens je viens de penser que si le nombre de reals n'est pas un multiple de 4 ça ne va pas être bon.
Si on est sorti du foreach sans fermer la dernière div 'project-row', alors il faut le faire maintenant.

foreach ($reals as $real)
{
    ...
}

if ($counter != 1)
{
    echo '</div>';
}

Si tu me dis qu'effectivement il fallait rajouter ça, alors j'éditerai le post qui est en 'solution'.

Mass22
Auteur

Salut @SLK,

En effet, ta solution fonctionne ! :-) Merci beaucoup !