php - 如何将行 ID 从数据库传递到模式对话框？

Question

我有一个模式对话框，我希望它根据特定行的 ID 显示数据库中该行的特定字段。我试图将行 ID 从数据库传递到模式对话框，以便我可以将其用于查询，但我遇到了挑战，我该如何完成此操作？

 <?php

    $result = mysqli_query($con,"SELECT * FROM general_reservation ");
    $count = mysqli_num_rows($result);
echo "<b><center><h3>Cars Reserved By Districts</h3></center></b><br><br>";

while($row=mysqli_fetch_array($result)){
    $reservation_id = $row['reservation_id'];
    ?>

    <tr>
         <td><a  name="reserver"  data-id="myModal"  class="btn btn-link" data-toggle="modal" href="#myModal" >Reserver's Profile</a></td>

    </tr>

    <?php
$reserver = $row['reservation_id'];
    } //end of while loop ?>

    </tbody>
</table> 
<div class="modal fade" id="myModal" role="dialog">
             <div class="modal-dialog modal-sm">
             <div class="modal-content">
             <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title"><center>Reserver</center></h4>
            </div>
            <?php 
            $reserver = $row['reservation_id'];

        $reservation_id = 'reservation_id' ;
        $result = mysqli_query($con,"SELECT * FROM general_reservation WHERE reservation_id = '$reserver' ");
        $count = mysqli_num_rows($result);
        while($row=mysqli_fetch_array($result)){

                ?>
        <div class="modal-body">
        <p ><strong>First Name: </strong><?php echo $row['fname'];?> </p><br>
        <p ><strong>Last Name: </strong><?php echo $row['lname'];?></p><br>
        <p ><strong>Mobile Number: </strong><?php echo $row['mobile_number'];?></p>
        </div>
        <?php } //end of while loop ?>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        </div>
      </div>
    </div> 
  </div>

Answer 1

我也遇到了同样的问题，我尝试过 jQuery 对话框，许多已知和未知的弹出插件甚至从 codecanyon 支付了一个，但没有像 bootstrap modal 那样开箱即用，每个弹出插件都必须编写自定义代码才能在 PHP 中工作while 循环，然后下一个问题是用新内容刷新模式而不刷新页面。

我使用引导模式的方法是，我在您的案例中创建了一个单独的 php 文件 reservation-profile.php 并在 href 链接中添加带有 id 的文件 并调用弹出模式。

<?php
    $result = mysqli_query($con,"SELECT * FROM general_reservation ");
    $count = mysqli_num_rows($result);
    echo "<b><center><h3>Cars Reserved By Districts</h3></center></b><br><br>";

    while($row=mysqli_fetch_array($result)){
        $reservation_id = $row['reservation_id'];
    ?>

    <tr><td>
     <a data-toggle="modal" href="reservation-profile.php?id=<?php echo $reservation_id;?>" data-target="#myModal" class="btn btn-link">Reserver's Profile</a>
    </td></tr>

<?php
    //$reserver = $row['reservation_id']; //Don't Need this
    } //end of while loop
?>

//Bootstrap Modal
<div class="modal fade" id="myModal">
     <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <strong>Loading...</strong>
        </div>
    </div>
</div>

现在创建一个像这样的reservation-profile.php文件

<?php
//Include database connection here
$reserver = $_GET["id"]; //escape the string if you like
$result = mysqli_query($con,"SELECT * FROM general_reservation WHERE reservation_id = '$reserver' ");
//$count = mysqli_num_rows($result); //Don't need to count the rows too
$row = mysqli_fetch_array($result); //Don't need the loop if you wana fetch only single row against id
?>
<div class="modal-header">
    <button type="button" class="close" data-dismiss="modal">&times;</button>
    <h4 class="modal-title"><center>Reserver</center></h4>
</div>
<div class="modal-body">
    <p ><strong>First Name: </strong><?php echo $row['fname'];?> </p><br>
    <p ><strong>Last Name: </strong><?php echo $row['lname'];?></p><br>
    <p ><strong>Mobile Number: </strong><?php echo $row['mobile_number'];?></p>
</div>
<div class="modal-footer">
    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>

最后也是最重要的部分是使用新的详细信息刷新模式，而无需刷新页面。

下面的代码可以完成这项工作。您可以阅读更多相关信息 here
注意:将以下代码添加到调用模式的页面。不要将其添加到 reservation-profile.php

中

//First jQuery Library
//Bootstrap Library
<script>
$( document ).ready(function() {
    $('#myModal').on('hidden.bs.modal', function () {
          $(this).removeData('bs.modal');
    });
});
</script>

因此整个解决方案开箱即用，无需编写任何额外的代码行。