Episerver forms - post form data without page reload

Niklas Blomstrand

Vote:

Hi,

I'm planning to use Episerver forms on a page to gather information from the visitor regarding their purpose for visiting.
This will be shown as a small popup on the page. I want to use Episerver forms for this because of the ease of creating different forms and storing the data.

I did however notice when testing Episerver forms that when submitting the page reloads. I would like some pointer on what options I have to be able to submit the data without the page reload. Do I need to create a custom controller or would hooking in to one of the existing events suffice?

All input or help is greatly appreciated.

Thanks!

#187558

Jan 26, 2018 8:03

Dac Thach Nguyen

Vote:

Hi,

By default Forms using ajax to submit user data, no reload page necessary. Please check the file Forms.config contain this line:

workInNonJSMode="false"

Then try to restart site.

Hope this help.

#187577

Jan 29, 2018 8:41

Niklas Blomstrand

Vote:

Hi,

workInNonJSMode was already set to false unfortunatly.

I have Episerver forms 4.6 installed, could it be a version issue?

#187578

Jan 29, 2018 8:56

Dac Thach Nguyen

Vote:

Please check your browser if it support js. And open dev tool to see XHR requrest send to server. Can you try on fresh site with Alloy template?

#187579

Jan 29, 2018 9:00

Niklas Blomstrand

Vote:

I'm using latest version of Chrome and Firefox and have no addons or extensions to block js.

There are no XHR-requests sent when clicking submit, the page reloads.

Will test with a fresh Alloy and get back with results.

#187580

Jan 29, 2018 9:28

Dac Thach Nguyen

Vote:

Check if you make the form display a page after submitting. The redirecting can be set in "All Properites" mode of Forms or Submit button.

#187581

Jan 29, 2018 9:34

Niklas Blomstrand

Vote:

I did not use the redirecting property on the formcontainer or the submit-button.

It works fine in an Alloy site, there is a xhr-submit event as expected and the site does not reload. I installed the same version of Forms on the Alloy site.

#187591

Jan 29, 2018 10:30

Dac Thach Nguyen

Vote:

It might be due to lack of @Html.RequiredClientResources("Footer") and @Html.RequiredClientResources("Header") in your page template. Can you check that?

#187592

Jan 29, 2018 10:33

Niklas Blomstrand

Vote:

Yes I did miss those lines in my _layout view.

When including those lines I get SSL-protocol errors in the console from webresource.axd so it seems that it tried to load the resources but I'll have to configure ssl for my localhost in order to test.

#187594

Jan 29, 2018 11:20