Adding select dropdown to dialog window

Question

I'm having difficulty on how to add options to a selection for dialog.

The Adobe notes I'm reading are here: CQ.form.Selection

Scrolling down to options : Object[]/String will show you two ways to reference the options to provide the said selection, via object or string. I am trying to use the object method. The format example they provide is sufficient.

[
    {
        value: "pink", // all types except "combobox"
        text: "Pink",
        qtip: "Real Pink" // "select" and "combobox"
    }
]

However, CRXDE Lite does not allow me to select or type Object when adding a new property, and this is where I am at a loss. Is there another way to enter a complex value?

Answer 1

Adding options as an Object[] would be done via a child node, rather than properties. (In fact anywhere you see an Object in the API, think node rather than property.)

In your dialog.xml file, this would be done as follows:

<selectList
    jcr:primaryType="cq:Widget"
    defaultValue="0"
    fieldLabel="Number"
    name="./number"
    type="select"
    xtype="selection">
    <options jcr:primaryType="cq:WidgetCollection">
        <one
            jcr:primaryType="nt:unstructured"
            text="One"
            value="1"/>
        <two
            jcr:primaryType="nt:unstructured"
            text="Two"
            value="2"/>
        <three
            jcr:primaryType="nt:unstructured"
            text="Three"
            value="3"/>
        <four
            jcr:primaryType="nt:unstructured"
            text="Four"
            value="4"/>
    </options>
</selectList>

In CRXDE, this can be achieved by creating the same hierarchy:

1. Right-clicking your selection node and choosing Create > Node.
2. Give this node a jcr:primaryType of cq:WidgetCollection. This will hold your option values.
3. Individual options can now be added as child nodes of this, with a jcr:primaryType of nt:unstructured.
4. Place your properties (value, text, qtip) on these child nodes.