Expand my Community achievements bar.

Radically easy to access on brand approved content for distribution and omnichannel performant delivery. AEM Assets Content Hub and Dynamic Media with OpenAPI capabilities is now GA.

How to make the multifiled readonly in Touch UI

Avatar

Level 5

Hi Team ,

I am trying to make multifiled readonly in Touch UI in aem 6.5.But it is not working as expected. 

 

<options
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/form/multifield"
composite="{Boolean}true"
renderReadOnly="{Boolean}true"
fieldLabel="Add Options">
<field
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/container"
name="./hearEvServiceOptions">
<items jcr:primaryType="nt:unstructured">
<text
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/foundation/form/textfield"
fieldLabel="Text"
name="./optionText"/>
</items>
</field>
</options>

 

Any suggestion would be helpful. Thank you in advance.

Thanks,

Sandeep. 

 

 

4 Replies

Avatar

Community Advisor

Hello @Sandeep6 ,

As per the documentation read-only is not supported in multifield, https://developer.adobe.com/experience-manager/reference-materials/6-5/granite-ui/api/jcr_root/libs/... 

If you need this to meet the business requirement you can write custom JS and integrate with the component dialog by extraclientlibs. Add an additional class in the multifield and based on that class disable the 'Add' button.

Avatar

Community Advisor

Hi @Sandeep6, Although Multifield extend Field component, readOnly is not supported in multifield as @Sady_Rifat mentioned. Alternatively, you can add readOnly={Boolean}true to all the dialog fields of multifield, then all of the fields will be Read Only. 

<listItems jcr:primaryType="nt:unstructured"
  sling:resourceType="granite/ui/components/coral/foundation/form/multifield"
  composite="{Boolean}true"
  fieldDescription="Click 'Add Field' to add more item in list."
  fieldLabel="Item List"
  required="{Boolean}true">
  <field jcr:primaryType="nt:unstructured"
    sling:resourceType="granite/ui/components/coral/foundation/container"
    name="./listItems">
    <items jcr:primaryType="nt:unstructured">
      <firstName jcr:primaryType="nt:unstructured"
        sling:resourceType="granite/ui/components/coral/foundation/form/textfield"
        fieldLabel="First Name"
        readOnly="{Boolean}true"
        name="./firstName"/>
      <lastName jcr:primaryType="nt:unstructured"
        sling:resourceType="granite/ui/components/coral/foundation/form/textfield"
        fieldLabel="Last Name"
        readOnly="{Boolean}true"
        name="./lastName"/>
    </items>
  </field>
</listItems>

 

Avatar

Level 5

Hi,

I tried to add readOnly={Boolean}true to all the dialog fields of multifield, still no luck.