How to make sure block is dropped only at the top level
@anand-gopinath cool~ work like a charm. Now I found many data attributes usage.... It is a very good framework but the doc is lag behind...
Read full answer below ↓Question
For example I have two blocks A and B that I want to drop to the editor canvas. But sometimes the block that dropped later become the child of existing block. That is A>B layout. But I want to force the blocks can only be the sibling level.eg. A+B How can I do that? Maybe component:add event?
Answers (3)
@anand-gopinath cool~ work like a charm. Now I found many data attributes usage.... It is a very good framework but the doc is lag behind...
@crazyxhz : You can do it by adding data attributes to the content "data-gjs-droppable='.className'", For ex https://jsfiddle.net/wswvuvab/2/
This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.
Related Questions and Answers
Continue research with similar issue discussions.
Issue #2061
[QUESTION] How to place a component at the end of the canvas.
How can I put my footer at the end of the canvas? I want the editor to not allow placing a block/widget below the footer. example
Issue #1683
How to change id/class when new element drop on editor or render element with dynamic ip?
Hello @artf , Hope you are doing well. I have two questions regards dynamic blocks adding, 1) Is it possible to render the block with dynam...
Issue #459
Error when including a custom component inside another block
Sorry for the vague title. I'm not sure how to describe this concisely. I have a custom block where i want to restrict that only images can...
Issue #1380
How can i make elements absolutely positioned on canvas by default when dropped.
Grapejs is what i have been looking for over a long time now. Though by default, all elements are relatively positioned when dropped on the...
Paid Plugins That Match This Issue
Curated by issue keywords and label relevance to help you ship faster.
Loading paid plugin recommendations...
Check the open-source GrapesJS plugins on GitHub or run a quick search in our free catalog.
Browse free plugins →Premium plugins ship with support, regular updates, and production-ready features — save days of integration work.
Browse premium plugins →Related tutorials
In-depth guides on the same topic.
Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.