Best practices submitting form without reload with ajax or similar

You can use fetch and post the entire page using formdata object. Then when the response from the post returns with code 200, update the forms page - either with the response from the fetch or your custom implementation.

When you do, remember to fire Dynamicweb antispam script first. The forms onsubmit attribute contains the script, which will look something like this (the ids changes all the time, so you cannot hardcode it):

s=function(e){e.elements['FormCH1_h'].value='fbaffa6c92f285df22f1755f8f0b1779';e.elements['_sys_to_email'].value='';e.setAttribute('action', '/Default.aspx?ID=106&PID=2761');return true};return s(this);

You can get that script from this tag:

@GetString("Form.OnSubmit")

Something like this:

var dynamicwebForm = document.getElementById('dw-form-1');
//Call the Form.OnSubmit code here...
const form = new FormData(dynamicwebForm);
fetch('/login', {
  method: 'POST',
  body: form
});

Read full docs here: https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch

Developer forum

Best practices submitting form without reload with ajax or similar

Replies