Creating a Granite/Coral Multi field HTL component for Adobe Experience Manager

You can create an Adobe Experience Manager (AEM) 6.3 Touch UI component that uses a Granite/Coral multi-field. That is, you can use a Granite/Coral multi-field data type to build a dialog that lets an author enter information into a multi-field control in the component's dialog, as shown in this illustration.

A Granite multi-field is based on granite/ui/components/foundation/form/multifield.  To learn how to work with a Granite multi-field, see http://scottsdigitalcommunity.blogspot.ca/2017/08/creating-aem-html-template-language-63.html. 

A Granite/Coral multi-field is based on  granite/ui/components/coral/foundation/form/multifield. There are several advantages to working with  Granite/Coral multi-field. For one thing, you do not need to write a JS script or use the ACS-Commons package.

However, there are also some differences too. One important difference to understand is how the data is stored in the JCR. By default, Granite/Coral multi-field data is stored as child nodes, as shown in the illustration. Notice that each multi-field is a separate node, as shown here. 

This changes the way you read the multi-field data when using Java business logic. In this example, item0 represents the first multi-field and item1 represents the second field. The properties of these nodes represents the values that the author entered into the dialog. 

You can develop Java business logic in a WCMUsePojo class to read the dialog values and then display the data in the HTL component. This is covered in this development article. 

To read this development article, click https://helpx.adobe.com/experience-manager/using/multifield_coral_aem63.html.

Join the Experience League

To become an Experience Business, you need more than just great tools and online help. You need a partner. Experience League is a new enablement program with guided learning to help you get the most out of Adobe Experience Cloud. With training materials, one-to-one expert support, and a thriving community of fellow professionals, Experience League is a comprehensive program designed to help you become your best.

Join the Adobe Experience League by clicking this banner.

I (Scott Macdonald) am a Senior Experience League Community Manager at Adobe Systems with 20 years in the high tech industry. I am also a programmer with knowledge in Java, JavaScript, C#,C++, HTML, XML and ActionScript. If  you would like to see more AEM or other end to end articles like this, then leave a comment and let me know what content you would like to see.

Linked In: http://www.linkedin.com/in/scottmacdonald2010

YouTube: Subscribe to the AEM Community Channel.