Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
BedrockMission!

Learn More

View all

Sign in to view all badges

Re-usable Color Select in Touch UI Dialogs w/ ACS Common’s Generic Lists | AEM Community Blog Seeding

Avatar

Avatar
Establish
Community Manager
kautuk_sahni
Community Manager

Likes

1,129 likes

Total Posts

6,140 posts

Correct Reply

1,144 solutions
Top badges earned
Establish
Coach
Originator
Contributor 2
Contributor
View profile

Avatar
Establish
Community Manager
kautuk_sahni
Community Manager

Likes

1,129 likes

Total Posts

6,140 posts

Correct Reply

1,144 solutions
Top badges earned
Establish
Coach
Originator
Contributor 2
Contributor
View profile
kautuk_sahni
Community Manager

19-01-2021

BlogImage.jpg

Re-usable Color Select in Touch UI Dialogs w/ ACS Common’s Generic Lists by sourcedcode

Abstract

While working on AEM component’s Touch UI dialogues, in particular, with colors, there are many cases where developers will need to configure the same color options over and over again. We catch ourselves repeating code, which becomes uneasy to maintain changes to the color options. What happens when there is a new color option? Going through many files include a new color option is not that efficient.

In this article, we will be putting together a centralized configuration for color options that can be used by any Touch UI configuration throughout our AEM project utilizing the ACS Common’s Generic Lists. This tutorial will assume that you have your IDE opened, so you can copy and paste code to test.

What is ACS Commons Generic Lists?

Generic Lists are a feature allowing easy creation and management of lists of title/value pairs. This configuration can be used as a data source for Touch UI dialogues.
Content authors can amend and manage the list at any time, as long as they have permissions to /etc/acs-commons/lists/* they can make changes immediately.

When saving a selected value from the ACS Common’s Generic List datasource, the value will is copied and set in the components property. So you can imagine, the set value is not a reference but the value itself.

Implementation
In this part of the article, we will be going to step by step, creating a new generic list to hold our shared color options. Then we will set up our Touch UI component, and finally, show you how to amend the list in the author view.

1. Create the ACS Commons Generic List
Create a folder structure of /etc/acs-commons/lists/customcolors/.content.xml. Use the configuration as indicated below. Here you can see that we are creating a new page (ACS Common’s standards) with a parsys which is used to hold a collection of generic list items.

Read Full Blog

Re-usable Color Select in Touch UI Dialogs w/ ACS Common’s Generic Lists

Q&A

Please use this thread to ask the related questions.

AEM AEMEBlogSeeding Experience Manager