PAYATHON 2026

PHP 表格弹窗提交时如何传递所点击行的参考编号？

数据小陈

结论

问题在于每一行都用了相同的 id="id01"。点击任意一行时，document.getElementById('id01') 都会返回第一个匹配的元素，所以打开的总是第一行的弹窗，提交的隐藏字段也来自第一行。

为每行弹窗设置唯一的 id，再让点击和关闭函数操作对应弹窗。隐藏字段仍使用该行的 $cld['ReferenceNumber'] 填充。

修改表格代码

在 foreach 循环内用行号生成唯一的弹窗 id：

<?php
$i = 1;
foreach ($collectLeaveDetails as $cld) {
    $modalId = 'id01-' . $i;
?>
<tr class="rowcolor">
  <!-- 其他单元格 -->
  <td style="text-align: center;">
    <div style="cursor: pointer" onclick="openLoginPopup('<?= $modalId ?>');">
      <?= htmlspecialchars((string) $cld['ReferenceNumber'], ENT_QUOTES, 'UTF-8') ?>
    </div>

    <div id="<?= $modalId ?>" class="modal">
      <span onclick="closeLoginPopup('<?= $modalId ?>');" class="close">&times;</span>
      <div class="modalcontent animate">
        <form method="post" action="<?= htmlspecialchars('cvd-admin/view.php', ENT_QUOTES, 'UTF-8') ?>">
          <input
            type="hidden"
            name="refnum"
            value="<?= htmlspecialchars((string) $cld['ReferenceNumber'], ENT_QUOTES, 'UTF-8') ?>"
          >
          <input type="submit" name="submit" value="Submit">
        </form>
      </div>
    </div>
  </td>
  <!-- 其他单元格 -->
</tr>
<?php
    ++$i;
}
?>

$modalId 会依次生成 id01-1、id01-2 等值。点击某一行时，openLoginPopup() 会收到该行弹窗的 id，弹窗中的隐藏字段则包含该行的 ReferenceNumber。

修改 JavaScript

让两个函数接收弹窗的 id：

function openLoginPopup(modalId) {
  document.getElementById(modalId).style.display = 'block';
}

function closeLoginPopup(modalId) {
  document.getElementById(modalId).style.display = 'none';
}

在 view.php 读取提交值

表单通过 POST 提交后，可以这样读取 refnum：

<?php
if (isset($_POST['refnum'])) {
    $rn = $_POST['refnum'];
    echo htmlspecialchars($rn, ENT_QUOTES, 'UTF-8');
}
?>

这里用 isset() 检查字段是否已提交，并在输出到 HTML 时进行转义。检查页面生成后的 HTML，可以确认每行弹窗的 id 都不相同，且隐藏字段的 value 与该行的参考编号一致。

备注：内容仅供参考。