-
SimonFevyerGP
Hi GenerateBlocks Team,
I asked AI to help me write this, the language is a bit flowery but I am sure you will get the gist…
I’m currently testing out the new Forms block beta and absolutely love having a lightweight form builder native to GB! However, I’ve run into a roadblock regarding accessibility and custom error validation.
What I am trying to achieve:
I want to build a WCAG-compliant form using my own custom error message text blocks (hidden by default) paired with inputs using aria-describedby and aria-invalid. I intend to use JavaScript to toggle their visibility and manage keyboard focus (moving focus to the first invalid field upon a failed submission).The Issue:
To do this, browser-default error bubbles need to be disabled. I noticed that the opening <form> tag actually outputs novalidate=”novalidate” by default. However, when submitting the form with errors, the native browser bubbles still appear.It seems the internal AJAX submission script is likely calling reportValidity() or a similar native method to check the fields before hitting the REST API endpoint. Because JS manually triggers this, it completely bypasses the HTML novalidate attribute.
Why this matters:
Right now, this makes it impossible to use custom, styled, or screen-reader-friendly validation messages because the native browser bubbles force themselves over the UI. I have managed to source a complex JavaScript workaround using event capturing and stopImmediatePropagation() to hijack the submit event before the GB script fires, but this feels like a hammer to crack a nut for a core form feature.Suggestions for the final release:
Could we get a toggle switch in the Form block settings to completely disable the internal browser-bubble validation?
Alternatively, if novalidate is detected on the form (or turned on via the Pro HTML Attributes panel), could the internal JS skip the reportValidity() check so developers can handle their own custom error states smoothly?
Thanks for all the hard work on this beta! Curious to know if a control for this is already on the roadmap.
-
Hi there,
I don’t think GB has a form block. May I see the block on your site?
-
SimonFevyerGP
I am testing the new Generateblocks Form block (Version 2.3.0-alpha.1). Testing it on a local site so I can’t share the site with you.
-
Hum…GB does not have a form block… It’s likely from another plugin.
Can you take a screenshot for me?
-
SimonFevyerGP
https://i.postimg.cc/VL84N7RX/Screenshot-2026-05-28-at-19-54-40.png
Hi Ying,
Many thanks for the prompt replies.
The Generateblocks Form block is in Beta at the moment.
I am testing it.
Providing feedback.
Should I be using another channel to do this?You can find info about it on the Generatepress website.
https://learn.generatepress.com/blocks/block/form/ -
Ah, sorry, I got it now, you are using the latest beta version of the plugins.
Thank you for providing the testing feedback, much appreciated!
I’ll forward your feedback to the dev team to improve the block.
-
David
Hi there,
Thanks for the suggestion- we will add a data attribute for removing browser validation
Regards
David
-
SimonFevyerGP
Many thanks David,
Keep up the good work. Loving Generateblocks. -
David
In Beta 3 released yesterday you can use the
data-gb-skip-native-validationattribute on the Form to disable the browser validation.Let us know how you get on
-
SimonFevyerGP
That looks like it is working. Had to add a value of true. Many thanks.
- You must be logged in to reply to this topic.