Find component associated with HTML element in iframe/visual editor.

Question

Hi! I'm working on an implementation of GrapesJS where I can a drag&drop a piece of text from outside GrapesJS into an existing text element/component. I don't use the drag&drop functionality of GrapesJS for this, but the native (browser) drag&drop. I have some code working for this, a working drag & drop, and I can change the text in the visual editor (inside the iframe). But this doesn't change the actual content of the document, as they are processed/stored in the background (in components,...

artf · Accepted Answer

You can query the wrapper to get component models, eg. BTW it's not clear why the content is not updating while you say I can change the text in the visual editor (inside the iframe)

alexroosenstein · Answer

Thanks! I'll give it a go tomorrow. By the way, I update the text via JQuery using the text() function, but when I move the element to a different position the original text reappears again.

japo32 · Answer

I had the same issue where I move the component with drag and drop. My solution was to add a text component inside my custom component. :)

Find component associated with HTML element in iframe/visual editor.

Question

Answers (3)

Related Questions and Answers

The css classes are removed and the autogenerated ids for each html tags gets changed ( Example : ivj5m-2) after each reload

Modals close on mouseup event outside of modal rather than a full click

ID changes when importing html or passing html in components prop in config.

GrapeJS/drag and drop not working for Brave on Linux and Wayland

Paid Plugins That Match This Issue

Browse Plugin Categories