[BUG]: Some form components not working well with Preset Webpage Plugin
Question
Hi, I've noticed that some form components (like checkbox, radio and select) are not working when gjs is initialized with the Preset Webpage Plugin like in the example below: You can confirm this issue with the online Webpage Demo too https://grapesjs.com/demo.html
Expected Behavior: can select all of them normally (only in preview mode)
Current Behavior: can't select anything (not even in preview mode)
BTW: when I click in the select it shows the options far from its parent (in the first gif) but this is due to this gif when recording it because actually it shows right below the select as the normal behavior, so just ignore that.
Answers (3)
Ah ok, now I got it. Yeah, forms plugin avoids some default input behavior, so it's intended. I agree that in the preview mode those behaviors could be re-enabled but I think that part might be integrated as a plugin (eg. by using event listeners on the preview command)
Hum...ok, I'll try to do that, thanks for the help :+1:
After rebuild the plugin the behavior works as expected, so problem resolved.
Maybe there is a reason why I've done that?! 😅
Via plugin, you can simply extend those components and override handleClick function with your logic, where you prevent only if the editor is not in the preview (editor.Commands.isActive('preview'))
Related Questions and Answers
Continue research with similar issue discussions.
Issue #1328
[Question/bug] Reordering components in the canvas
I've noticed some inconsistencies when moving DOM components around in the canvas. Description in the gif below using the Webpage Demo: In...
Issue #2579
[Bug]: Blocks icons & font size too small to read
Hi, I am using grapesjs webpage preset plugin to create the webpage builder. But as you can see the icons and font size of the blocks is to...
Issue #2068
GrapesJs gradient plugin not working anymore
Hello GrapesJs team After updating the grapesjs version form 14.0.59 i noticed the gradient plugin stopped to work, i also checked the grad...
Issue #6409
BUG: Cannot drag to move components on mobile
GrapesJS version [x] I confirm to use the latest version of GrapesJS What browser are you using? Chrome v133 Reproducible demo link https:/...
Paid Plugins That Match This Issue
Curated by issue keywords and label relevance to help you ship faster.
Loading paid plugin recommendations...
Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.