AEM 页面属性禁用字段重新启用

编程问答 2022-05-16

问题描述

我在 AEM 6.5 中工作，我正在为页面属性开发一项功能，以根据复选框值禁用字段。它工作得很好，因为我能够成功启用/禁用字段。但是，当我刷新页面时，我无法将这些输入字段保持在禁用状态。

我尝试记录一些数据以查看发生了什么，并且我可以看到 disabled 属性已正确添加到我想要禁用的元素上。我正在使用 foundation-contentloaded 事件来执行一些将禁用字段的逻辑。但是，当我浏览页面并检查这些元素时，它们不再是 disabled 并且禁用的属性消失了。

我的第一个猜测是，在 foundation-contentloaded 事件触发后，还有其他一些核心逻辑可以启用/禁用输入。

我在这里使用了正确的事件监听器吗？这是我启用/禁用字段的 JS 脚本


  /**
 * Extension to the standard checkBox component. It enables/disables  other components based on the
 * selection made in the checkBox.
 *
 * How to use:
 *
 * - add the class cq-dialog-checkBox-enabledisable to the checkBox element
 * - add the class cq-dialog-checkBox-enabledisable-target to each fields that can be enabled/disabled
 */
(function(document,$) {
  "use strict";

  
  $(document).on("foundation-contentloaded",function(e) {
      // Not working great !

      enabledisable($(".cq-dialog-checkBox-enabledisable"));
  });

  $(document).on("change",".cq-dialog-checkBox-enabledisable",function(e) {
      // work great !
      enabledisable($(this));
  });


  function enabledisable(el){
      el.each(function(i,element) {
          if ($(element).prop("tagName") === "CORAL-CHECKBox"){
              $.each($('.cq-dialog-checkBox-enabledisable-target'),function (index,el) {
                var inputs = $(el).find("input");
                var buttons = $(el).find("button");
                inputs.each(function (index,el) {
                  el.disabled = $(element).prop('checked');
                });
                buttons.each(function (index,el) {
                  el.disabled = $(element).prop('checked');
                });
              });
          }
      })
  }
})(document,Granite.$);

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

aemaem-6javajavajavascriptsightly