Empêcher les envois en double dans AEM Adaptive Forms avec les pièces jointes

Cet article décrit comment empêcher les utilisateurs d’envoyer plusieurs fois le Forms adaptatif AEM en désactivant le bouton Envoyer pendant le traitement, en particulier lorsque des pièces jointes sont impliquées.

Description description

Environnement

Adobe Experience Manager (AEM) Forms adaptatif (toutes les versions)

Problème/Symptômes

Les utilisateurs peuvent envoyer le même formulaire adaptatif plusieurs fois en cliquant sur le bouton Envoyer à plusieurs reprises, en particulier lorsque des pièces jointes sont en cours de chargement ou que le formulaire est en cours de traitement. Cela peut entraîner des envois en double et un traitement involontaire des données.

Cause

Les composants AEM Forms Foundation ne fournissent pas de fonctionnalité prête à l’emploi pour empêcher les envois en double. Les composants principaux pour le Forms adaptatif incluent une logique intégrée pour désactiver le bouton Envoyer lors de l’envoi, mais cela n’est pas disponible dans les composants de base.

Résolution resolution

Procédez comme suit pour résoudre le problème :

  1. Identifiez le type de composant utilisé dans votre formulaire adaptatif :

    • Si vous utilisez des composants de base AEM Forms, passez à l’étape 2.
    • Si vous utilisez des composants principaux AEM pour le Forms adaptatif, reportez-vous à l’étape 4.
  2. Pour les composants de base (pas de prévention des envois en double prêts à l’emploi) :

    • Implémentez la personnalisation côté client pour désactiver le bouton Envoyer après le premier clic ou une fois la validation réussie.
    • Exemple de JavaScript pour désactiver le bouton Envoyer :
    code language-none
    document.addEventListener('DOMContentLoaded', function() {
        var submitBtn = document.querySelector('button[ type="submit"] ');
        if (submitBtn) {
            submitBtn.addEventListener('click', function(e) {
                // Optionally, add validation check here
                submitBtn.disabled = true;
                // Optionally, show a loading spinner or message
            });
        }
    });
    
    • Testez minutieusement le formulaire, en particulier avec les pièces jointes, pour vous assurer que le bouton Envoyer reste désactivé jusqu’à la fin du traitement.
  3. Éventuellement, implémentez une logique de serveur principal pour détecter et rejeter les envois en double en fonction d’identifiants uniques ou de jetons de session.

  4. Pour les composants principaux (prévention des envois en double prête à l’emploi) :

    • Effectuez la mise à niveau vers ou utilisez les composants principaux AEM pour le Forms adaptatif s’ils ne sont pas déjà utilisés.
    • Les composants principaux désactivent automatiquement le bouton Envoyer après validation et pendant l’envoi, empêchant les envois en double.
  5. Fournissez toujours des commentaires à l’utilisateur ou à l’utilisatrice (comme une double flèche de chargement ou un message) lors du traitement du formulaire afin de décourager les clics répétés.

  6. Après l’implémentation de la solution, testez le formulaire en essayant de cliquer sur Envoyer plusieurs fois pendant le chargement ou le traitement du fichier. Le bouton doit être désactivé après le premier clic et une seule soumission doit être traitée.

recommendation-more-help
experience-cloud-kcs-help-kbarticles