Author Dialog Multi Select Render Auto Sorting

[Sady_Rifat]

Hello members,
I have a multi-select field. I select multiple values from the select box.

After submitting the dialog, values are saved according to my selected order.
The problem is when I reopen the dialog, it sort alphabetically. How do I prevent this?

This is my sample code,

<buttonIcon
        jcr:primaryType="nt:unstructured"
        sling:resourceType="granite/ui/components/coral/foundation/form/select"
        multiple="true"
        fieldLabel="Button Icon"
        name="./buttonIcon">
    <items jcr:primaryType="nt:unstructured">
        <arrow
                jcr:primaryType="nt:unstructured"
                text="Arrow"
                value="arrow"/>
        <email
                jcr:primaryType="nt:unstructured"
                text="Email"
                value="email"/>
        <next
                jcr:primaryType="nt:unstructured"
                text="Next"
                value="next"/>
        <check
                jcr:primaryType="nt:unstructured"
                text="Check"
                value="check"/>
    </items>
</buttonIcon>

[EstebanBustamante]

Hi,

From what I can see in the AEM Granite Select implementation, the options are already sorted in the backend, rather than when the HTML is being built (see line 276 of /libs/granite/ui/components/coral/foundation/form/select/render.jsp). Therefore, an overlay won’t work in this case. Your best option would be to tweak this using JavaScript.

Hope this helps.