Content Fragment Template: Leveraging Coral DatePicker within Multifield Container Results in Duplicate Rendering (AEM 6.4) | Community
Skip to main content
Level 2
October 2, 2020
Solved

Content Fragment Template: Leveraging Coral DatePicker within Multifield Container Results in Duplicate Rendering (AEM 6.4)

  • October 2, 2020
  • 1 reply
  • 2845 views

Hello,

Having a weird issue with a content fragment template that I'm a little stumped on. I've found the following article that details how to build multifield components for content fragments; I was able to get this to work with some multifield containers that have multiple items in them (textfields, dropdowns, and booleans.)

 

However, I am currently trying to build another multifield, but this time one whose container has the datepicker, and it has some weird rendering issues. 

 

The datepicker is rendering within the multifield container just fine (with the option to add and move as many as I like), but also renders a single datepicker just below the multifield component. Both fields save as well. When I look in the CRXDE, I'm not seeing this item on the content fragment template so I'm not sure where it is coming from. 

 

Exported CFM Template: 

 

 

<?xml version="1.0" encoding="UTF-8"?> <jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0" jcr:primaryType="cq:Template" allowedPaths="[/content/entities(/.*)?]" ranking="{Long}100"> <jcr:content cq:lastModified="{Date}2020-09-28T15:19:30.775-04:00" cq:lastModifiedBy="admin" cq:scaffolding="/conf/mob/settings/dam/cfm/models/google-calendar/jcr:content/model" cq:templateType="/libs/settings/dam/cfm/model-types/fragment" jcr:primaryType="cq:PageContent" jcr:title="Google Calendar" sling:resourceSuperType="dam/cfm/models/console/components/data/entity" sling:resourceType="dam/cfm/models/console/components/data/entity/default"> <model cq:targetPath="/content/entities" jcr:primaryType="cq:PageContent" sling:resourceType="wcm/scaffolding/components/scaffolding" dataTypesConfig="/mnt/overlay/settings/dam/cfm/models/formbuilderconfig/datatypes" maxGeneratedOrder="20"> <cq:dialog jcr:primaryType="nt:unstructured" sling:resourceType="cq/gui/components/authoring/dialog"> <content jcr:lastModified="{Date}2020-09-28T15:19:30.775-04:00" jcr:lastModifiedBy="admin" jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/fixedcolumns"> <items jcr:primaryType="nt:unstructured" maxGeneratedOrder="26"> <_x0031_601320662556 jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/form/textfield" fieldLabel="Location" listOrder="21" maxlength="255" metaType="text-single" name="location" renderReadOnly="false" showEmptyInReadOnly="true" valueType="string"/> <_x0031_601320674201 jcr:primaryType="nt:unstructured" sling:resourceType="dam/cfm/models/editor/components/contentreference" fieldLabel="Rich Content" filter="hierarchy" listOrder="22" metaType="reference" name="richContent" nameSuffix="contentReference" renderReadOnly="false" showEmptyInReadOnly="true" valueType="string"/> <_x0031_601320700858 jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/form/checkbox" listOrder="23" metaType="boolean" name="allDay" renderReadOnly="false" showEmptyInReadOnly="true" text="All Day" valueType="boolean"/> <_x0031_601320716959 jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/form/checkbox" listOrder="24" metaType="boolean" name="publish" renderReadOnly="false" showEmptyInReadOnly="true" text="Publish" valueType="boolean"/> <_x0031_601320729702 jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/form/checkbox" listOrder="25" metaType="boolean" name="displayOnDevice" renderReadOnly="false" showEmptyInReadOnly="true" text="Display On Device" valueType="boolean"/> <_x0031_595880916027 jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/form/multifield" composite="{Boolean}true" fieldLabel="Dates" listOrder="22" maxlength="255" metaType="text-single" name="calendarDates" renderReadOnly="false" showEmptyInReadOnly="true" valueType="string[]"> <field jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/container" name="./calendarDates"> <items jcr:primaryType="nt:unstructured"> <column jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/container"> <layout jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/layouts/fixedcolumns"/> <items jcr:primaryType="nt:unstructured"> <calendarDate jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/form/datepicker" displayedFormat="YYYY-MM-DD HH:mm" emptyText="YYYY-MM-DD HH:mm" listOrder="5" metaType="date" name="calendarDate" renderReadOnly="false" showEmptyInReadOnly="true" valueFormat="YYYY-MM-DD[T]HH:mm:ss.000Z" valueType="calendar"/> </items> </column> </items> </field> </_x0031_595880916027> </items> </content> </cq:dialog> </model> </jcr:content> </jcr:root>

 

 

 

Any ideas? 

 

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by Manjunath_K

Hi @aemrand 

 

I tried to reproduce this issue in my local AEM instance using dialog xml which you shared & this additional datepicker below multifield is getting added because of metaType property as highlighted below. remove this metaType property & this issue will be resolved.

 

Remove metaType property:

 

 

 

Before removing metaType property:

 

 

 

After removing metaType property:

 

-Manjunath

1 reply

Manjunath_K
Manjunath_KAccepted solution
Level 7
October 3, 2020

Hi @aemrand 

 

I tried to reproduce this issue in my local AEM instance using dialog xml which you shared & this additional datepicker below multifield is getting added because of metaType property as highlighted below. remove this metaType property & this issue will be resolved.

 

Remove metaType property:

 

 

 

Before removing metaType property:

 

 

 

After removing metaType property:

 

-Manjunath

May 17, 2023

I have the above xml but the issue i am facing is that , when i aagain edit the content fragment it does not shows the already pre selected dates

 

New Member
February 11, 2025

I'm facing the same issue where if you close this fragment and then re-open it, the dates won't show anymore. Was anyone able to get this to part of it to work?