Prevent double form submission

[onOffice-Web]

• Some customers reported that multiple identical search profiles were created for the same address
• Some customers reported that multiple property request have been made. All of them have been automatically answered and in some cases multiple contacts have been created

This is caused by clicking the "send" button multiple times or reloading the page, each time sending a new request / search profile.

While a clean way of dealing with this issue is to add a nonce and check it in the post handler to detect duplicate requests, this approach is too time consuming for now.

Instead we want to prevent double form submission using JavaScript by disabling further submission once the form is sent. One approach is to mark the form with a class and hook into the submit callback.

• We do not want to put inline scripts on each form.

[yeneastgate]

@fredericalpers Currently, we don't have an optimal solution for this issue, I need two days to investigate and will estimate time with you later.

[dai-eastgate]

@fredericalpers I have some points to confirm with you:

-"Some customers reported that multiple identical search profiles were created for the same address" means you are mentioning to "interest form"?
-"Some customers reported that multiple property request have been made. All of them have been automatically answered and in some cases multiple contacts have been created" means you are mentioning to "inquiry form" in the detail view page?

-"We do not want to put inline scripts on each form."
means we need to prevent double form submission in all forms (contact form, interest form, owner form)?

After researching, I found that, "Double form submission" happened in 2 cases:
Case 1: the "send" button multiple times
We will use "JavaScript by disabling further submission once the form is sent. One approach is to mark the form with a class and hook into the submit callback." as you mentioned.

Case 2: reloading the page
The reason for creating the same address is because in "form_data", the values submitted from the form always exist
=> When reloading, those data are still sent to create address.

But we also found that on the system there is a feature "Check for Duplicates"

In case a Form which email field is checked as "Required" and the "Check for Duplicates" checkbox is activated, the case that generates the same data will not exist.
Attached video:

duplicate_checkbox.mp4

So, we will prevent double form submission in the case 2 address records created: no email but other information is the same.

For this issue we also found a solution but we are not sure it is the optimal solution.

Please let us know your opinion about that.
If there is anything incorrect, please also give us your opinion.
Or anything that you want to add?

[fredericalpers]

@dai-eastgate

"Some customers reported that multiple identical search profiles were created for the same address" means you are mentioning to "interest form"?

• Yes, in this case it is the "interest form"

"Some customers reported that multiple property request have been made. All of them have been automatically answered and in some cases multiple contacts have been created" means you are mentioning to "inquiry form" in the detail view page?

• Yes, in this case it is the inquiry form on the detail page.

"We do not want to put inline scripts on each form."
means we need to prevent double form submission in all forms (contact form, interest form, owner form)?

• Yes, that would be ideal. The above mentioned were only few examples.

Please go ahead and fix Case 1 first.

---

I think for Case 2 we will need to keep the Success or Error Messages in the view of the customer after sending a form or even better implement a redirect to a "Thank you for your message" page. I would like to fix Case 2 in a separat issue later.

Information about Duplicate check

Unfortunately the duplicate check in the plugin will only check for the same E-Mail. This means if someone sends the same form with the same E-Mail it will delete the oldest record.

[dai-eastgate]

@fredericalpers I need 4 days to implement and test for Case 1.

[yeneastgate]

@fredericalpers I fixed Case 1 (prevent double form submission when clicking the "send" button multiple times). Please look at my video and let me know your opinion. Thanks!

submission.mp4

[onOffice-Web]

@fredericalpers I fixed Case 1 (prevent double form submission when clicking the "send" button multiple times). Please look at my video and let me know your opinion. Thanks!

submission.mp4

Looks good to me! Thank you :)