How to append a child component at required position/index
Use at, as an index, in options, eg. component.append(comp, { at: 0 }) will place the comp as a first element
Read full answer below ↓Question
For example, I have a parent component and this parent component has 4 child components. Here with trait functionality, I want to move the 3rd child component to 1st position likewise.
I am able to move a component from any position to last by removing it from the existing position using component.remove() and adding it to parent using component.append(ref of removecomponent) . So it is moving to last.
Now I want to move a child component from one place to another place on trait value change
Can you give me any idea?
Thanks in Advance.
Answers (2)
Use at, as an index, in options, eg. component.append(comp, { at: 0 }) will place the comp as a first element
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 #1792
[Question] Exclude some components from final html (Multi-level)
Hi, I have a question about how to exclude HTML from editor->getHtml(). My structure is something like that. ParentChild -- Child --- Child...
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 #1868
How to enable functionality only for specific image component, not all
I've enabled the fa fa-pencil icon into my image components, but I want it to be enabled only in specific image components, not all of them...
Issue #1780
How to change extra dropdown for link change trait
Hello @artf , I want to give one more functionality to user like user can change any link with default links drop down. In above image i wa...
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.