November Happy Hour will be moved to Thursday December 5th.

Trigger validation on submit form without posting full page

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
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
* You are NOT allowed to include any hyperlinks in the post because your account hasn't associated to your company. User profile should be updated.