Day 17 - Granite Datasources (Dynamic Dropdown) | AEM Community Blog Seeding

Day 17 - Granite Datasources (Dynamic Dropdown) by Redquark Blog

Abstract

Howdy fellow devs 👋! In AEM development, sometimes we might have requirements to populate the same data at multiple places. For e.g., suppose we have a requirement to create a text, an image and a video component and we need to provide background colour to these components in the form of a dropdown. These background colours will be same throughout our application code.

A naive way to achieve this is to create the same colour nodes under all the component’s cq:dialog. Here we are not getting any code reusability. Wouldn’t it be great if we create all the colour nodes once and reuse it anywhere we want? Granite Datasource is the answer to this question.

A datasource is the factory to provide a collection of Resource and are normally used to dynamically populate data in the dialog fields such as dropdowns. Thus, we only have to maintain our dropdown values only at one location and it can be used throughout our entire code. Pretty cool, eh 😎?

Code Example
In this post, we are going to create a simple component which will use three dropdowns with countries , colors and fonts options. Instead of following the conventional approach of creating nodes of options underneath the dropdown node, we will use json files with all the data and then that data will be populated in the component’s dialog.

Read Full Blog

Day 17 - Granite Datasources (Dynamic Dropdown)

Q&A

Please use this thread to ask the related questions.