### [Passage automatique à la page suivante sur les formulaires multipages](https://wpforms.com/developers/how-to-move-to-the-next-page-automatically/) **Publié :** 29 juin 2022 **Auteur :** Umair Majeed **Extrait :** Dans ce tutoriel, nous allons vous montrer comment passer automatiquement à la page suivante de votre formulaire multipage en fonction de la réponse à un champ de formulaire. **Contenu :** Souhaitez-vous que vos formulaires multipages avancent automatiquement lorsque les utilisateurs font des sélections ? Avec un simple extrait de code, vous pouvez créer une expérience de formulaire plus fluide en passant automatiquement à la page suivante lorsque les utilisateurs sélectionnent leurs réponses. Cette amélioration réduit les clics et rend vos formulaires plus intuitifs à compléter. Ce guide vous montrera comment faire avancer automatiquement vos formulaires multipages en fonction des sélections des utilisateurs. ## Création de la structure de votre formulaire Tout d'abord, vous aurez besoin d'un formulaire multipage avec des champs et des sauts de page. Pour les besoins de ce tutoriel, nous créons un formulaire de sélection de cadeaux, il y aura trois champs **Choix multiples** utilisant des **Choix d'images**. Chaque sélection comprendra un **Saut de page**. Si vous avez besoin d'aide pour créer un formulaire multipage, veuillez consulter notre guide sur [la création de formulaires multipages](https://wpforms.com/docs/how-to-create-multi-page-forms-in-wpforms/). ## Ajout du CSS d'auto-avancement Comme nous voulons que le formulaire passe automatiquement à la page suivante en fonction de **n'importe quelle** sélection, nous allons ajouter du CSS pour masquer les boutons **Suivant** de ce formulaire. Pour ce faire, copiez ce CSS sur votre site. ``` form#wpforms-form-1000 button.wpforms-page-button { visibility: hidden; } ``` N'oubliez pas de remplacer `1000` par l'ID de votre formulaire. Si vous avez besoin d'aide pour trouver l'ID de votre formulaire, consultez notre guide sur [comment trouver les ID de formulaire et de champ](https://wpforms.com/docs/how-to-use-the-forms-locator-in-wpforms/). ## Ajout du JavaScript d'auto-avancement Ensuite, ajoutez cet extrait de code pour activer l'avancement automatique de la page. Si vous avez besoin d'aide pour ajouter des extraits de code, veuillez consulter notre tutoriel sur [l'ajout d'extraits de code](https://wpforms.com/developers/how-to-add-custom-php-or-javascript-for-wpforms/). **Remarque :** Ce code cible les **Choix d'images** à l'aide de la classe `.wpforms-image-choices`. Si votre champ utilise des **Choix d'icônes**, mettez à jour le sélecteur à la **ligne 12** en remplaçant `.wpforms-image-choices` par `.wpforms-icon-choices` pour que le script fonctionne correctement. Le script fonctionne en ciblant votre formulaire spécifique à l'aide de l'ID du formulaire (remplacez `1000` par votre ID), en écoutant les clics sur les entrées de Choix d'images et en déclenchant automatiquement le clic sur le bouton **Suivant** lorsqu'une sélection est effectuée. ## Options de personnalisation Vous pouvez modifier cette fonctionnalité pour cibler des questions spécifiques en ajustant le sélecteur jQuery, ajouter des conditions pour l'avancement, ou rediriger vers différentes pages en fonction des réponses. Voici un exemple qui avance uniquement lorsque « **Oui** » est sélectionné : ``` function wpf_dev_conditional_next_page() { ?> **Catégories :** Extension **Tags :** Javascript, jQuery, JS, PHP ---