0

Gente, tenho um template que tem o seguinte:

    <div class="row">

        <!-- INICIO -->
        <div class="col-md-4">
            Aqui vem uma imagem e o nome de um imóvel
        </div>

    </div>
        <!-- FIM -->

Estou buscando do banco de dados alguns imóveis, usando laravel, mas poderia ser qualquer outro framework.

Preciso, então, fazer um foreach, de forma que percorra todos os imóveis e a cada 3 imóveis eu pule uma linha (criar uma nova row) e inserir cada imóvel em uma coluna.

Como eu posso fazer esse foreach?

Estou com muita dúvida.

Obrigado.

2 Respostas 2

1

Você pode fazer algo assim:

<?php $count = 0; ?>
<?php foreach($seus_imoveis as $imovel): ?>
    <?php if($count == 0): ?>
        <div class="row">
    <?php endif; ?>

    <div class="col-md-4">
        Aqui vem uma imagem e o nome de um imóvel
    </div>

    <?php $count+=1; ?>

    <?php if($count == 0): ?>
        </div>
    <?php endif; ?>

    <?php if($count==3) $count = 0; ?>

<?php endforeach; ?>

Dessa forma na primeira vez vai abrir o div row e no final da terceira irá fechá-lo, assim sucessivamente.

0

Acabei utilizando o exemplo do seguinte link:

https://stackoverflow.com/questions/40561301/loop-row-in-bootstrap-every-3-columns/42837768

Utilizando a função array_chunk do PHP que separa um array em vários arrays.

Depois iterando da seguinte forma:

@foreach($imoveis as $imoveisLinha)

        <div class="row">

            @foreach($imoveisLinha as $imovel)
                <!-- INICIO -->
                <div class="col-md-4">
                        <div class="imovel-exibicao thumbnail">
                            <div class="row">
                                <div class="col-sm-12">
                                    <div class="faixa">
                                        <img src="img/imovel/ex.jpg" alt="" />
                                        <span class="faixa-padrao">Aluguel</span>
                                    </div>

                                    <div class="espacamento-imovel">
                                        <div class="titulo-imovel-ex">
                                            <a href="">Village Garavelo I - Casa 2 Quartos</a>
                                        </div>

                                        <div class="desc-imovel-ex">
                                            Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eum molestiae tempora ipsa laborum explicabo rerum, odit assumenda. Perferendis distinctio corporis quidem aperiam nobis, explicabo vero, sint animi perspiciatis, omnis ipsum!
                                        </div>

                                        <div class="preco-imovel-ex">
                                            R$ 100.000,00
                                        </div>

                                        <div class="localizacao-imovel-ex">
                                            Goiânia
                                        </div>

                                        <div class="mais-info">
                                            <a href="imovel" type="button" class="btn botao">Mais Informações</a>
                                        </div>

                                    </div>

                                    <div class="info-imovel-ex hidden-sm hidden-xs">
                                        <div class="row">
                                            <div class="icones-info">
                                                <div class="col-sm-3">
                                                    <div class="i-metros" data-toggle="tooltip" data-placement="top" title="Metros"> 123m²</div>
                                                </div>

                                                <div class="col-sm-3">
                                                    <div class="i-quartos" data-toggle="tooltip" data-placement="top" title="Quartos"> 3</div>
                                                </div>

                                                <div class="col-sm-3">
                                                    <div class="i-banheiros" data-toggle="tooltip" data-placement="top" title="Banheiros"> 3</div>
                                                </div>

                                                <div class="col-sm-3">
                                                    <div class="i-garagens" data-toggle="tooltip" data-placement="top" title="Garagens"> 1</div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
            @endforeach
        </div>
    @endforeach

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .