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
Bedrock Mission!

Learn more

View all

Sign in to view all badges

SOLVED

Dragging a component onto something OTHER than a parsys

Avatar

Level 2

Is there a straightforward way to build a component that can accept another component being dragged on without a parsys? Eg, perhaps I define a "row" component that creates three regions, each of which can have one component added, and that component might be video player, image, text, etc. I'm currently using v5.4, but upgrading to 5.6.1 might be a possibility.

1 Accepted Solution

Avatar

Correct answer by
Employee

Correct; multiple components can be added to each parsys.

There was a question posted recently [0] with a similar ask. In short, there is no OOTB way to limit a parsys to only accept one component, nor a component that can only be placed on any given page once.

[0] http://stackoverflow.com/questions/18713857/how-to-restrict-a-component-to-add-only-once-per-page/

View solution in original post

5 Replies

Avatar

Level 10

You can use standard HTML5 DnD. if you want. This will require custom development of a CQ component. See this community article as an example of using HTMl5 DnD with AEM: http://scottsdigitalcommunity.blogspot.ca/2012/08/creating-cq-applications-that-use-html.html.

So basically you can use JQuery to define a custom CQ component and use DIV and CSS to define valid drop zones on the CQ page. Jquery supports a lot of flexibility as well in terms of drag and drop functionality. 

Avatar

Employee

Hi Joel,

I built an accordion component based on Bootstrap collapse which demonstrates this functionality: https://github.com/blefebvre/cq-bootstrap-accordion

You can specify the number of sections you'd like in the component using the edit dialog. If you select 3, in edit mode you will have 3 droppable parsys sections. With wcmmode=disabled you will see only one section of the accordion expanded at once. 

Avatar

Level 2

Thanks, I'll check that out. Just looking at the source on github, it looks like multiple components could be added to each parsys - is that correct? Is there a way to limit that to one item per parsys?

 

Scott, I was thinking more of an approach where the drag source is the Sidekick, which seems like I'd need to integrate with the ExtJS supporting CQ right?

Avatar

Correct answer by
Employee

Correct; multiple components can be added to each parsys.

There was a question posted recently [0] with a similar ask. In short, there is no OOTB way to limit a parsys to only accept one component, nor a component that can only be placed on any given page once.

[0] http://stackoverflow.com/questions/18713857/how-to-restrict-a-component-to-add-only-once-per-page/

Avatar

Level 10

If you want to drag from sidekick - you can place components based on JQuery in the sidekick on them - however - the article that i referenced - the start zone was also on the page - not the sidekick.