How to open first item of multifield on load of dialog?

Question

I need to open first item of multifield on dialog load. I looked at the API documentation of multifield but not able to find.

<promo
                    jcr:primaryType="cq:Widget"
                    fieldLabel="abcd"
                    hideLabel="false"
                    itemId="abcd"
                    name="./abcd"
                    xtype="[multifield]">
                    <fieldConfig
                        jcr:primaryType="cq:Widget"
                        hideLabel="false"
                        layout="form"
                        name="./abcd"
                        title="abcd Item Info"
                        xtype="customPanel">
                        <items jcr:primaryType="cq:WidgetCollection">

                        </items>
                    </fieldConfig>
                </promo>

Please suggest.

Answer 1

You can listen to the loadcontent event fired by the Multifield after the content has been loaded. If there was no content available initially, use the addItem() method to add an item and then redo the layout.

A sample configuration using multiple path field is shown below. You can adapt the same as per your requirements.

<promo
    jcr:primaryType="cq:Widget"
    fieldLabel="Select Paths"
    name="./paths"
    xtype="multifield">
    <fieldConfig
        jcr:primaryType="nt:unstructured"
        xtype="pathfield" />
    <listeners
        jcr:primaryType="nt:unstructured"
        loadcontent="function(field, record)
        {
           if(record.get('paths') == undefined)
          {
            field.addItem(); field.doLayout();
          }
        }" />
</promo>

Answer 2

Improving the above provided solution, try to replace the loadcontent line with,

loadcontent="function(field, record) {if(field.getValue().length == 0) {field.addItem();} }"