40395 Multiple forms with reCAPTCHA lead to wrong submission

css/onoffice-forms.css

@@ -3,7 +3,7 @@ span.onoffice-pleasefill {
 	margin-right: 5pt;
 }
 
-.onoffice-unclickable-form
+.onoffice-unclickable-form,
 .oo-form input[type=submit]:disabled,
 #onoffice-form input[type=submit]:disabled {
 	opacity: 0.5;

js/onoffice-prevent-double-form-submission.js

@@ -20,10 +20,8 @@ jQuery(document).ready(function ($) {
 
             if ($(submitButton).is(':visible')) {
                 submitButton.on('click', function () {
-                    if (formElement.checkValidity()) {
-                        submitButton.prop('disabled', true);
-                        submitButton.addClass('onoffice-unclickable-form');
-                    }
+                    submitButton.prop('disabled', true);
+                    submitButton.addClass('onoffice-unclickable-form');
                 });
             }
         });

templates.dist/form/applicantform.php

@@ -37,6 +37,8 @@
 	echo '<p>'.esc_html__('ERROR!', 'onoffice-for-wp-websites').'</p>';
 } elseif ($pForm->getFormStatus() === \onOffice\WPlugin\FormPost::MESSAGE_REQUIRED_FIELDS_MISSING) {
 	echo '<p>'.esc_html__('Missing Fields!', 'onoffice-for-wp-websites').'</p>';
+} elseif ($pForm->getFormStatus() === onOffice\WPlugin\FormPost::MESSAGE_RECAPTCHA_SPAM) {
+	echo '<p>'.esc_html__('Spam detected!', 'onoffice-for-wp-websites').'</p>';
 }
 
 /* @var $pForm \onOffice\WPlugin\Form */

templates.dist/form/applicantsearchform.php

@@ -39,6 +39,8 @@
 
 if ($pForm->getFormStatus() === onOffice\WPlugin\FormPost::MESSAGE_ERROR) {
 	echo esc_html__('ERROR!', 'onoffice-for-wp-websites');
+} elseif ($pForm->getFormStatus() === onOffice\WPlugin\FormPost::MESSAGE_RECAPTCHA_SPAM) {
+	echo esc_html__('Spam detected!', 'onoffice-for-wp-websites');
 }
 
 /* @var $pForm \onOffice\WPlugin\Form */

templates.dist/form/formsubmit.php

@@ -23,29 +23,34 @@
 /** @var \onOffice\WPlugin\Form $pForm */
 if ($pForm->needsReCaptcha() && $key !== '') {
 	$formId = $pForm->getGenericSetting('formId');
+	$pFormNo = $pForm->getFormNo();
 ?>
 	<script>
-		function onSubmit() {
-			var element = document.getElementById(<?php echo json_encode($formId); ?>);
-			element.submit();
+		var submited = false;
+		function submitForm<?php echo $pFormNo; ?>() {
+			if (submited) {
+				return;
+			}
+			const formNo = <?php echo $pFormNo; ?>;
+			const selectorFormById = `form[id="onoffice-form"] input[name="oo_formno"][value="${formNo}"]`;
+			const form = document.querySelector(selectorFormById).parentElement;
+			submited = true;
+			form.submit();
+		}
+		function submit<?php echo $pFormNo; ?>() {
+			const formNo = <?php echo $pFormNo; ?>;
+			const selectorFormById = `form[id="onoffice-form"] input[name="oo_formno"][value="${formNo}"]`;
+			const form = document.querySelector(selectorFormById).parentElement;
+			const submitButtonElement = form.querySelector('.submit_button');
+			onOffice.captchaControl(form, submitButtonElement);
 		}
 	</script>
 
-	<div id='recaptcha' class="g-recaptcha"
-		data-sitekey="<?php echo esc_attr($key); ?>"
-		data-callback="onSubmit"
-		data-size="invisible"></div>
-	<button class="submit_button"><?php echo esc_html($pForm->getGenericSetting('submitButtonLabel')); ?></button>
-	<script>
-	(function() {
-		var formId = <?php echo json_encode($formId); ?>;
-		var formElement = document.getElementById(formId);
-		var submitButtonElement = formElement.getElementsByClassName('submit_button')[0];
-		onOffice.captchaControl(formElement, submitButtonElement);
-	})();
-
-
-	</script>
+	<button class="submit_button g-recaptcha" data-sitekey="<?php echo esc_attr($key); ?>" 
+		data-callback="submitForm<?php echo $pFormNo; ?>" data-size="invisible"
+		onClick="submit<?php echo $pFormNo; ?>">
+		<?php echo esc_html($pForm->getGenericSetting('submitButtonLabel')); ?>
+	</button>
 <?php
 } else {
 ?>

templates.dist/form/ownerform.php

@@ -37,6 +37,8 @@
 } else {
 	if ($pForm->getFormStatus() === \onOffice\WPlugin\FormPost::MESSAGE_ERROR) {
 		echo esc_html__('ERROR!', 'onoffice-for-wp-websites');
+	} elseif ($pForm->getFormStatus() === onOffice\WPlugin\FormPost::MESSAGE_RECAPTCHA_SPAM) {
+		echo esc_html__('Spam detected!', 'onoffice-for-wp-websites');
 	}
 
 	/* @var $pForm \onOffice\WPlugin\Form */