AEM 自定义小部件:: 动态添加 fieldLabel 和 fieldDescription答案

【问题标题】：AEM custom widget:: dynamically adding fieldLabel and fieldDescriptionAEM 自定义小部件:: 动态添加 fieldLabel 和 fieldDescription
【发布时间】：2015-02-06 02:44:43
【问题描述】：

我创建了一个自定义小部件。下面给出的是代码sn-p

this.word = new CQ.Ext.form.TextField({
  fieldLabel: "Word",
  fieldDescription: "Please enter a word in the format: Word",
  allowBlank: false,
  autoWidth: false,
 // regex: /^[A-Z][a-zA-Z\s]+$/,
 // regexText: 'Enter only alphabets here.First character has to be an alphabet in uppercase.',
  listeners: {
    change: {
      scope: this,
      fn: this.updateHidden
    }
  }
});

小部件工作正常。我还有另一个在功能方面与此类似的要求。唯一不同的是 fieldLabel 和 fieldDescription 的值。我认为为此创建另一个小部件不是一个好主意。有什么办法可以让这两个动态。

仅供参考，我使用的是 AEM 6。

提前致谢

【问题讨论】：

标签： extjs aem

【解决方案1】：

您可以使用侦听器并即时更改值。我用added 事件尝试了它，它似乎有效。

this.word = new CQ.Ext.form.TextField({
 fieldLabel: "Word",
 fieldDescription: "Please enter a word in the format: Word",
 allowBlank: false,
 autoWidth: false,
 // regex: /^[A-Z][a-zA-Z\s]+$/,
 // regexText: 'Enter only alphabets here.First character has to be an alphabet in uppercase.',
 listeners: {
   change: {
     scope: this,
     fn: this.updateHidden
   },
   added: function(textfield,ownerct,index){
    if(//some condition here){
      textfield.fieldLabel = "new field label",
      textfield.fieldDescription = "new field description"
     } 
   }
 }
});

【讨论】：

嘿沙拉特，感谢您的回复。问这个我可能很傻。但是，如果 'add:function..' 进入 JS 并且在 JS 本身中设置了 fieldLabel 值（“新字段标签”），我不确定它是如何使 fieldLabel 和 fieldDescription 动态化的。同样，我可能听起来很愚蠢或天真，但 ExtJs 并不是我的强项。如果你能在这里做一点手工处理，我将不胜感激。谢谢。
您想何时更改字段标签和描述？这些值是预先确定的吗？
我正在考虑将 fieldLabel 和 fieldDescription 定义为组件的属性。即将这两个属性分配给 cq:Component。你有什么建议？

【解决方案2】：

如果您想为不同的组件使用相同的小部件，并且每个组件必须是唯一的字段（对您而言 - fieldLabel 和 fieldDescription），

试试这个：

var label = this.fieldLabel;
var description = this.fieldDescription;

this.word = new CQ.Ext.form.TextField({
    fieldLabel: (label || label == '') ? label : "Word",
    fieldDescription: (description || description == '') ? description : "Please enter a word in the format: Word",
    allowBlank: false,
    autoWidth: false,
    // regex: /^[A-Z][a-zA-Z\s]+$/,
    // regexText: 'Enter only alphabets here.First character has to be an alphabet in uppercase.',
    listeners: {
        change: {
            scope: this,
            fn: this.updateHidden
        }
    }
});

“this.fieldLabel” - 从您使用小部件的组件对话框中获取新值“fieldLabel”：

...
fieldLabel="New Value fieldLabel For Custom Widget"
xtype="yourCustomWidget"/>
...

【讨论】：