主页 / coding / 问题 / 79033912
Accepted
Alex
Asked: 2024-09-28 17:57:22 +0800 CST

表格单元格中的按钮用于打开模式对话框

  • 772

我有一张包含一些 PHP 和表单的表格。以下是其中的一部分，显示了一个按钮被放置在单元格中：

if ($giorno == "ven"){
echo '<td>'.$qres["ven_1"].'</td>;
echo '<td>';
?>
<form action="?" method="post">
 <input type="hidden" id="ven_1" name="ven_1" value="<?php echo $qres["ven_1"];?>">
 <button type="submit" class="btn" id="ts">click me</button>
</form>
<?php
echo '</td>';
}

表格下方我有一个触发模态对话框的脚本。

它基本上计算一些细胞并在对话框中显示数量。

<script>
const re1 = /^[0-9][A-Z]/;
const re2 = /^c[0-9]/;

const actives = $('td').filter(function() {
  const text = $(this).text();
  const makeActive = text.match(re1) !== null;
  $(this).toggleClass('active', makeActive);
  $(this).toggleClass('compresenza', text.match(re2) !== null);
  return makeActive;
}).length;

$('<div id="messaggio"></div>').html(`${actives}`).dialog({
    title: 'Title',
    width: '300px',
    buttons: {},
    modal: true,
});
</script>

事实上，当 HTML 页面加载时，对话框就会打开。我想将对话框设置为，并且仅在单击上表中的按钮时才autoOpen: false打开它。

实现这一目标的正确程序是什么？

javascript

1 个回答

  1. Best Answer

    您可以将对话框的开头放入function，例如

    function openDialog(actives) {
    $('<div id="messaggio"></div>').html(`${actives}`).dialog({
        title: 'Title',
        width: '300px',
        buttons: {},
       modal: true,
    });
}

    并创建一个活动，例如

    document.querySelector('form button#ts').addEventListener("click", function() {
    //TODO: Make sure actives is reachable and properly initialized here
    openDialog(actives);
    e.preventDefault();
    return false;
});

    编辑：

    您的按钮提交表单，这就是您的对话框只出现几分之一秒的原因。要解决这个问题，您需要e.preventDefault()和/或return false;点击处理程序内部阻止表单提交。

    • 1

相关问题