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

Question

Hi,

I built a component and block that I can drag and drop in the canvas.

My issue is that some styles rely on the ID. I know this might not be ideal, but it's like this at the moment.

My problem is when I reload the editor with my previous values by passing it in the components prop, all my ID's are changed.

Is there a way to prevent this?

Like, only change ID's for newly added blocks and not imported code or existing code?

I tried searching but could not see an option.

Thanks!

artf · Accepted Answer

@simplecommerce new release published

simplecommerce · Answer

Anyone have any idea for this issue? My issue happens when I use for example, bootstrap tabs, in order to make them work and load the right tab, it uses the ID, but since the ID is being regenerated when I load the editor with my components again (for editing), the tabs no longer work, since all ID are replaced and incremented. Initial drag and drop. Reload As you can see, my id's have changed.

sbiwaichoon · Answer

same issue here.if i have use that id in code, id change when(id-2) reload template to grapejs (auto added "-2" to my id) , if i dont use that id in any part of my code, is fine, id wont change

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

Question

Answers (3)

Related Questions and Answers

[QUESTION] Dynamic class generation with a template

[Question] need to find nessesary event.

[QUESTION] Selection of custom components not possible from canvas.

[QUESTION]: Drag and drop external html to editor ?

Paid Plugins That Match This Issue

Related tutorials

🚀 Introducing GrapesJS Email Blocky: The Ultimate Email Block Library for GrapesJS

Browse Plugin Categories