1

Bom o problema é o seguinte: Eu tenho o seguinte código HTML/PHP que me permite ir buscar os últimos quatros dados inseridos na base de dados de forma a mostrar os últimos adicionados:

$getLastFour = mysqli_query($dbc,"Select * From products Order By id_product DESC LIMIT 4") or die(mysqli_error($dbc));

while($row = mysqli_fetch_array($getLastFour)){
        $idProd = $row["id_product"];
        $name = $row["name_Product"];
        $price = $row["prod_price"];
        $description = $row["prod_description"];

?>
<div class="col-md-2">
            <div class="grid">
                <div class="portfolio app mix_all" data-cat="app" style="display: inline-block; opacity: 1;">
                    <div class="portfolio-wrapper">
                        <a data-toggle="modal" data-target=".bs-example-modal-md" href="#" class="b-link-stripe b-animate-go  thickbox">
                            <img src="images/cont1.jpg"/>
                            <div class="b-wrapper"><h2 class="b-animate b-from-left b-delay03 ">
                                <img src="images/link-ico.png" class="img-responsive" name="showDescr"  alt=""/></h2>
                            </div>
                        </a>
                    </div>
                </div>
                <p class="text-center image" style="color: #990000;"><b><u><?php echo $name ?></u></b></p>
                <h2 class="text-center image"><b><?php echo $price.'€' ?></b></h2>
                <p class="text-center button" ><a href="details.html">Comprar</a></p>
            </div>
        </div>
<?php
        }
        ?>

Até aqui tudo bem funciona perfeitamente. Mas como podem ver no código ao carregar no imagem de tag name showDescr supostamente aparece uma modal que mostrará a descrição do produto.

O problema é que não posso o seguinte código da modal dentro do ciclo while senão mostrará todos os resultados ao mesmo tempo (em supbreposição) e fora mostrará somente um. O código da modal é seguinte:

<!-- modal start -->
        <a data-toggle="modal" data-target=".bs-example-modal-md" href="#"> </a>
        <div class="modal fade bs-example-modal-md light-box" tabindex="-1" role="dialog"
             aria-labelledby="mySmallModalLabel" aria-hidden="true">
            <div class="modal-dialog modal-md">
                <div class="modal-content light-box-info">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><img
                            src="images/close.png" title="close"/></button>
                    <h3>Descrição do Produto</h3>
                    <p><?php echo $description ?></p>
                </div><!-- end modal content -->
            </div><!-- end modal dialog -->
        </div><!-- end modal fade -->

Será que tenho que dar um nome diferente à imagem que ao carregar aparecerá a modal na tag name exemplo:

name="<?php echo $idProd ?>"
2
  • Como estás a carregar a modal ? Apenas com link ou ajax ?
    – Hugo Alves
    27/09/2016 às 10:42
  • Com o uso do data target, bootstrap 27/09/2016 às 12:53

2 Respostas 2

0

usa um form com input hidden com value "id" na botão onde queres abrir o modal e no modal para ler os dados usa um função em PHP que te faça a leitura do id com a variável Post com MySQL query usando o id para segmentar o conteúdo que queres. eu tenho a mesmo a funcionar mas em Lavarel.

verificas a inserção com: if(isset($_POST['minha_modal'])){} e no form coloca assim : "> #

0

Consegui acabar por resolver o problema. Então fiz o seguinte: No botão (que neste caso é uma imagem) para abrir a modal no atributo data-targetpara alem do nome que atribui a modal dei-lhe tambem o id proveniente do busca na base de dados. E no código da modal criei um atributo id e dei-lhe o respectivo nome para que o target funciona-se.

Código alterado:

<div class="b-wrapper"><h2 class="b-animate b-from-left b-delay03 ">
                                <img src="images/link-ico.png" data-toggle="modal" data-target="#MyModal<?php echo $idImage; ?>" class="img-responsive"  alt=""/></h2>
                            </div>

<div class="modal fade bs-example-modal-md light-box" tabindex="-1" role="dialog"
             aria-labelledby="mySmallModalLabel" aria-hidden="true" id="MyModal<?php echo $idImage;?>">
            <div class="modal-dialog modal-md">
                <div class="modal-content light-box-info">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><img
                            src="images/close.png" title="close"/></button>
                    <h3>Descrição do Produto</h3>
                    <p><?php echo $description ?></p>
                </div><!-- end modal content -->
            </div><!-- end modal dialog -->
        </div><!-- end modal fade -->

P.S: O código da modal terá que estar obrigatoriamente dentro do while (apresentado na descrição da pergunta em cima) para iterar sobre os vários id's existentes

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 .