如何 select/Deselect oracle apex 表单中的所有复选框

Question

我在 Oracle Apex 中有一个页面区域，其中包含许多复选框（顶点形式）。我想要一个功能，可以在每个复选框项目的 header 处添加一个复选框，这将 Select/Deselect 下面的所有复选框项目。

我是 Apex 开发的新手，需要这方面的帮助。

Answer 1

这是一个假设复选框上方的文本来自项目标签的解决方案（不知何故我不认为是这种情况）。如果需要，当我了解更多信息时，我可以更新答案以更好地适合您的页面。

首先，选中要添加此 "toggle" 功能的每个复选框。向下滚动到 CSS 类 属性并在字段中输入 toggle-cb。

接下来，转到页面级属性并将以下代码添加到函数和全局变量声明属性中：

function enableToggle() {
  var $wrapperDiv = $(this);
  var $label = $wrapperDiv.find('.t-Form-label');
  var $item = $wrapperDiv.find('.apex-item-checkbox');
  var buttonHtml = '<button type="button" class="t-Button t-Button--tiny t-Button--simple">Toggle all</button>';

  $label.html($label.text() + ' ' + buttonHtml);

  $label.find('button').on('click', function(event) {
    var $button = $(this);
    var $checkboxes = $item.find('input[type="checkbox"]');
    var checkedCount = $checkboxes.filter(function() {
      return this.checked === true;
    }).length;
    var check = checkedCount < $checkboxes.length;

    $checkboxes.each(function() {
      this.checked = check;
    });

    event.stopPropagation();
    $button.blur();
  });
}

最后，将以下代码添加到页面的 Execute when Page Loads 属性中：

$('.toggle-cb').each(enableToggle);

这将为每个项目的标签添加一个按钮（前提是复选框具有切换 cb class），用于切换：

请参阅以下内容以了解有关上面使用的代码的更多信息： https://www.youtube.com/watch?v=Pjur4Zkkwsk&list=PLUo-NIMouZ_sgdQpMbXXwhHKpwRggCY34&index=1

如何 select/Deselect oracle apex 表单中的所有复选框

How to select/Deselect all checkboxes in oracle apex form

javascript

jquery

oracle

oracle-apex-19.1