Issue #4929πŸ’¬ AnsweredOpened February 14, 2023by handhikadj0 reactions

A tag inside button is removed

Quick answerby artf

This happens because of the button implementation in the forms plugin, which allows only textnodes as children. If you remove the form plugin you'll be able to see the <a> element (if you prefer you can also extend the button component with your own logic).

Read full answer below ↓

Question

GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? Chrome LatestReproducible demo link https://codesandbox.io/s/interesting-bell-xntbtrDescribe the bug How to reproduce the bug?go to the codesandboxdrag and drop Custom Code block.put this code inside the Custom Code editor and click Save:Click the button.The button should open the href link when you click it but it's not. Noticed that the a tag is removed inside the button tag What is the expected behavior? <a> tag is not removedCode of Conduct[X] I agree to follow this project's Code of Conduct

Answers (4)

artfβ€’ February 22, 2023

This happens because of the button implementation in the forms plugin, which allows only textnodes as children. If you remove the form plugin you'll be able to see the <a> element (if you prefer you can also extend the button component with your own logic).

handhikadjβ€’ February 23, 2023

so what is the code of "normal" implementation of the button? btw, may I know why do you make the button to behave like that on the forms plugin?

artfβ€’ February 23, 2023

If I recall properly the main reason there was a problem with inline text editing with button elements, so that approach was the easiest way to fix a common issue. I guess the "normal" implementation would be to skip/overwrite the init method but you should think on how to properly handle the inlin...

GJSBlockβ€’ May 17, 2026

Thanks for reporting this, @handhikadj. Great question about a tag inside button is removed. The recommended approach with GrapesJS is to use the event-driven API. Start here: Check the GrapesJS documentation for your specific module Look for the on() event listener method Most operations can be ac...

Related Questions and Answers

Continue research with similar issue discussions.

Paid Plugins That Match This Issue

Curated by issue keywords and label relevance to help you ship faster.

View all plugins

Loading paid plugin recommendations...

Free option

Check the open-source GrapesJS plugins on GitHub or run a quick search in our free catalog.

Browse free plugins β†’
Premium option

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.

All tutorials β†’

Browse Plugin Categories

Jump directly to plugin category pages on the marketplace.