基于模态框点击展示不同数据的教程

<?php

$mysqli = new mysqli('localhost', 'mushref', 'Almadina1!', 'security_db')
or die('Dramatic Error: ' . mysqli_error($mysqli));

$selectquery = "SELECT * FROM cases_reports";
$query = mysqli_query($mysqli, $selectquery);
$nums = mysqli_num_rows($query);

while($res = mysqli_fetch_array($query)) {
  $unique_id = 'modal-' . $res['irNumber']; // 生成唯一的 ID，例如 modal-123
?>
  <tr>
    <td class="name mb-0 text-sm"> <?php echo $res['cccEmployee']?> </td>
    <td> <?php echo $res['irNumber']?> </td>
    <td> <a href="#" class="modalLauncher" data-toggle="modal" data-target="#modal-default" data-case-type="<?php echo $res['caseType']?>" data-ir-number="<?php echo $res['irNumber']?>"><?php echo $res['caseType']?></a> </td>
    <td> <?php echo $res['startDateTime']?> </td>
    <td> <?php echo $res['endDateTime']?> </td>
    <td>
      <div class="dropdown">
        <a class="btn btn-sm btn-icon-only text-light" href="#" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
          <i class="fas fa-ellipsis-v"></i>
        </a>
        <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
          <a class="dropdown-item" href="#">Print PDF</a>
          <a class="dropdown-item" href="#">Export Excel</a>
          <a class="dropdown-item" href="#">Export Access</a>
        </div>
      </div>
    </td>
  </tr>
<?php }?> <!-- End php While -->

<div class="modal fade" id="modal-default" tabindex="-1" role="dialog" aria-labelledby="modal-default" aria-hidden="true">
  <div class="modal-dialog modal- modal-dialog-centered modal-" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h6 class="modal-title" id="modal-title-default"></h6>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">×</span>
        </button>
      </div>
      <div class="modal-body" id="modal-body-content">
      </div>
    </div>
  </div>
</div>

$(document).ready(function() {
  $(".modalLauncher").click(function(event) {
    event.preventDefault(); // 阻止默认的链接跳转行为

    // 获取 data-* 属性中的数据
    var caseType = $(this).data('case-type');
    var irNumber = $(this).data('ir-number');

    // 更新模态框标题和内容
    $("#modal-title-default").text(caseType + " - " + irNumber);
    $("#modal-body-content").text("Case Type: " + caseType + ", IR Number: " + irNumber);

    // 显示模态框
    $("#modal-default").modal('show');
  });
});

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>