Rearrange child components within parent component

Question

I have a parent component with cq:isContainer=true property and card components within the parent component.How to make the cards reorderable,i.e, move card 3 above card 1 etc?

Tethich · Accepted Answer

Hi @pleben

One way is to drag them in crx. But I guess is not desirable as it will be a pain to maintain this all the time.

Or, if you have a multifield, you can move up and down the items in the dialog.

Or, if you don't want to not rely on the order AEM stores them, you can have a "position" property for each card, authorable (you can also have a js to validate value uniqueness if you like ), and have a backendlogic (in Sling model eventually) that returns to your frontend components the list of cards in the configured ordered.

PRATHYUSHA_VP · Answer

Hi @pleben

If components are authored in page, you can rearrange components by dragging up and down. Please try once

If you're including the child components dynamically using data-sly-resource in parent component. You can reorder by updating the order in HTL code.

For more details :

https://aemlab.blogspot.com/2021/11/cqiscontainer-property-in-aem.html - By @arunpatidar

Hope this helps !

Sign up

Login with SSO

Login to the community

Login with SSO