使用MySQL数据库中的详细信息将数据从动态创建的一组图像动态传递到Modal

时间:2018-08-06 03:49:02

标签: php mysql bootstrap-4 bootstrap-modal

我使用从MySQL数据库检索的数据创建了多个对象。每个对象均包含一个可点击的图片和2个标题。我可以单击连接到模态的图像,但是无论单击哪个图像,它都只返回1个模态,并带有来自最后一个对象的信息。 请帮忙。

以下部分创建对象并工作。

<div class="row kprod">
  <?php
    $get_kits = "select * from kitchens ORDER BY k_brand";
    $run_kits = mysqli_query($con, $get_kits);
    while($row_slides=mysqli_fetch_array($run_kits)){
	    $kit_brand = $row_slides['k_brand'];
	    $kit_name = $row_slides['k_name'];
	    $kit_img = $row_slides['k_img'];
	    $kit_desc = $row_slides['k_description'];
	    $kit_id = $row_slides['k_id'];
							
	    echo"
	    <div class='col-12 col-xs-12 col-md-6 col-lg-4 kpindi'>
        <div class='row'>
          <div class='col imgcol'>
            <img class='img-fluid' src='assets/img/$kit_img' href='#portfolio-modal-1' data-toggle='modal'>
          </div>
        </div>
        <div class='row'>
          <div class='col'>
            <div>
              <h5 class='kprodtext' style='font-family:Adamina, serif;'>$kit_brand</h5>
              <h6 class='kprodtext' style='font-family:Adamina, serif;'><em>$kit_name</em></h6>
            </div>
          </div>
       </div>
     </div>";}
     ?>
</div>

下一部分是我也想传递数据的模式。

<div id="portfolio-modal-1" class="modal text-center" role="dialog" tabindex="-1">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button class="close" type="button" data-dismiss="modal" aria-label="Close">
        <span aria-hidden="true">x</span></button> 
      </div>
      <div class="modal-body">
        <div class="container text-center">
          <div class="row">
            <div class="col-lg-8 mx-auto">
              <h2  class="kprodtext" style="font-family:Adamina, serif;">
              Brand</h2>
              <hr class="star-dark mb-5">
              <img src="assets/img/image.jpg" class="img-fluid mb-5">
              <h6 class="kprodtext mb-5" style="font-family:Adamina, serif;">
                <i>Name</i>
              </h6>
              <p class="kprodtext" style="font-family:Adamina, serif;">
                Desc
              </p>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

1 个答案:

答案 0 :(得分:0)

您需要为模态分配不同的ID,否则只会打开一个。