extjs - 如何在一行 AEM 对话框中创建文本字段(经典 UI)

Question

上面的字段分为 2 行。我希望他们都排成一排。

使用的代码是:

<provinces jcr:primaryType="cq:Widget" fieldLabel="Province List" name="./provinces" xtype="multifield">
<fieldConfig
    jcr:primaryType="cq:Widget"
    xtype="multifieldpanel">
    <items jcr:primaryType="cq:WidgetCollection">
        <code
            jcr:primaryType="cq:Widget"
            fieldLabel="Code"
            key="code"
            xtype="textfield"/>
        <name
            jcr:primaryType="cq:Widget"
            fieldLabel="Name"
            key="name"
            xtype="textfield"/>
    </items>
</fieldConfig>

Answer 1

您应该为多字段使用 hbox 布局。将 layout="hbox" 添加到带有 xtype="multifieldpanel" 的节点，它应该可以工作。

Tested on my AEM 6.3 local instance

您的特定对话框代码变为:

<fieldConfig
    jcr:primaryType="cq:Widget"
    layout="hbox"
    xtype="multifieldpanel">
    <items jcr:primaryType="cq:WidgetCollection">
        <code
            jcr:primaryType="cq:Widget"
            fieldLabel="Code"
            key="code"
            xtype="textfield"/>
        <name
            jcr:primaryType="cq:Widget"
            fieldLabel="Name"
            key="name"
            xtype="textfield"/>
    </items>
</fieldConfig>

If you're interested in documentation, see the layout config option in the CQ.form.MultiField ExtJs documentation for AEM. You might be interested in the other layout options.

For future reference, when you have questions about classic UI widgets, try searching for that issue with extjs keyword, you'll find many articles that might help. For example, for this solution, I got the hint from this SO question and I found that SO question by searching "extjs in same row" then looked up the extjs AEM docs to see if there was a layout option for the multifield widget.