Generate id for AEM components | AEM Community Bl... - Adobe Experience League Community

We all know that when we add an AEM component to a page, it creates the DOM structure on the pages based upon our HTL file. Sometimes we require id attribute to be set in our div for n number of reasons. If we put id attribute in the HTL file itself then it will become static and if in include that component multiple times on the page, the same id will be repeated for all instance; which is not a neat solution. Wouldn't it be nice if we have a mechanism to generate an id randomly and uniquely for each instance of the component on the page? In this post, we are going to do just that. Hence, without further ado, let's get started - Step #1 Create a component that will have the field for unique id. We are making this id editable as well to give more flexibility to the content authors. Below is the cq:dialog.xml file -