Trigger validation on submit form without posting full page

carlos

Vote:

Hi,

We have a form that is rendered by React after receiving the form encoded html as a prop.

React renders this form dynamically depending on different tabs that are opened/closed.

Because of this, the form validation is not working as expected on client side and the form is causing a full refresh of the page.

We have noticed that since the form renders dynamically it does not get initialized and then there are no event listeners added to the form’s submit button to handle client-side validations.

Is there a way we can like attach the event or initialize the form so client-side validations are triggered?

We are using Episerver CMS 12.

Thank you!

#286373

Edited, Aug 30, 2022 17:39

Ynze

Vote:

Hi Carlos,

You can register the client resources manually like this:

var form = new FormContainerBlock();
var formController = new EPiServer.Forms.Controllers.FormContainerBlockController();
formController.RegisterCssResources();
formController.RegisterScriptResources(form);

Although you should retrieve your form and then pass it to the RegisterScriptResources method, because it checks the elements used in your form to register any additionally required scripts.

And make sure to render the resources in the head section on the page:

@Html.RequiredClientResources(RenderingTags.Header)

#286411

Aug 31, 2022 3:47

Try our conversational search powered by Generative AI!

Trigger validation on submit form without posting full page