php - 使用 mysql 和 php 将动态创建的 div 数据发送到 html modal答案

【问题标题】：php - Send dynamically created div's data to html modal using mysql and phpphp - 使用 mysql 和 php 将动态创建的 div 数据发送到 html modal
【发布时间】：2017-12-14 12:33:41
【问题描述】：

第一次我使用 while 循环用我的数据库数据创建了我的 div。所以它会创建多个div。然后我通过按钮打开了一个 div 的模式。问题是我无法将值传递给我的模态。

这是我的代码：

<style type="text/css">
    .product_view .modal-dialog{max-width: 800px; width: 100%;}
    .pre-cost{text-decoration: line-through; color: #a5a5a5;}
    .space-ten{padding: 10px 0;}
</style>

<body>
    <?php  $result = mysqli_query($conn, "SELECT * FROM table"); ?>
    <div class="container">
        <div class="row">
            <?php 
            while ($row = mysqli_fetch_array($result) )
                {   ?>
            <div class="col-md-4">
                <div class="thumbnail">
                    <img src="<?php echo $row['image']?>" alt="No image" class="img-responsive">
                    <div class="caption">
                        <h4 class="pull-right">$<?php echo $row['a'];?></h4>
                        <h4><a href="#"><?php echo $row['b'];?></a></h4>
                        <p><?php echo $row['c'];?></p>
                    </div>

                    <div class="space-ten"></div>
                    <div class="btn-ground text-center">
                        <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#product_view"><i class="fa fa-search"></i><?php $pid = $row['d'];?> Quick View</button>         
                    </div>
                    <div class="space-ten"></div>
                </div>
            </div>
            <?php } ?>

        </div>
    </div>

    <div class="modal fade product_view" id="product_view">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <a href="#" data-dismiss="modal" class="class pull-right"><span class="glyphicon glyphicon-remove"></span></a>
                    <h3 class="modal-title"><?php echo $row['d'];?></h3>
                </div>
                <div class="modal-body">
                    <div class="row">
                        <div class="col-md-6 product_img">
                            <img src="http://img.bbystatic.com/BestBuy_US/images/products/5613/5613060_sd.jpg" class="img-responsive">
                        </div>
                        <div class="col-md-6 product_content">
                            <h4>Product Id: <span>Here Should come $row['b'] of selected one</span></h4>

                            <p> Here Should come $row['c'].</p>

                            <div class="space-ten"></div>
                            <div class="btn-ground">
                                <button type="button" class="btn btn-primary"><span class="glyphicon glyphicon-shopping-cart"></span>Here Should come  $row['a']</button>
                                <button type="button" class="btn btn-primary"><span class="glyphicon glyphicon-heart"></span>Here Should come $row['b']</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>

div 示例现在让我们点击 1

他是我在 echo $row 的模态中得到的，最后一个值是 9。

知道我错过了什么吗？谢谢

【问题讨论】：

标签： php html mysql loops modal-dialog

【解决方案1】：

<style type="text/css">
.product_view .modal-dialog{max-width: 800px; width: 100%;}
.pre-cost{text-decoration: line-through; color: #a5a5a5;}
.space-ten{padding: 10px 0;}
</style>

<body>
<?php  $result = mysqli_query($conn, "SELECT * FROM table"); ?>
<div class="container">
    <div class="row">
        <?php 
        while ($row = mysqli_fetch_array($result) ): ?>
        <div class="col-md-4">
            <div class="thumbnail">
                <img src="<?php echo $row['image']?>" alt="No image" class="img-responsive">
                <div class="caption">
                    <h4 class="pull-right">$<?php echo $row['a'];?></h4>
                    <h4><a href="#"><?php echo $row['b'];?></a></h4>
                    <p><?php echo $row['c'];?></p>
                </div>

                <div class="space-ten"></div>
                <div class="btn-ground text-center">
                    <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#product_view"><i class="fa fa-search"></i><?php $pid = $row['d'];?> Quick View</button>         
                </div>
                <div class="space-ten"></div>
            </div>
        </div>


    </div>
</div>

<div class="modal fade product_view" id="product_view">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <a href="#" data-dismiss="modal" class="class pull-right"><span class="glyphicon glyphicon-remove"></span></a>
                <h3 class="modal-title"><?php echo $row['d'];?></h3>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-md-6 product_img">
                        <img src="http://img.bbystatic.com/BestBuy_US/images/products/5613/5613060_sd.jpg" class="img-responsive">
                    </div>
                    <div class="col-md-6 product_content">
                        <h4>Product Id: <span><?php echo $row['b'];?></span></h4>

                        <p><?php echo $row['c'];?></p>

                        <div class="space-ten"></div>
                        <div class="btn-ground">
                            <button type="button" class="btn btn-primary"><span class="glyphicon glyphicon-shopping-cart"></span>Here Should come  $row['a']</button>
                            <button type="button" class="btn btn-primary"><span class="glyphicon glyphicon-heart"></span>Here Should come $row['b']</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<?php endif: ?>

【讨论】：

可能是我的问题不清楚... $row 仅存储数据库中的最后一个值，因此它将显示所有 div 的最后一个值数据