Restreindre l'autocomplétion d'adresse à un pays spécifique

Aperçu

Souhaitez-vous restreindre la fonctionnalité de saisie semi-automatique d'adresses à un pays spécifique ? Lorsque vous créez vos propres schémas d'adresses uniques pour un pays souhaité, vous voudrez également vous assurer que la saisie semi-automatique d'adresses ne recherche que dans ce pays.

Dans cet article, nous vous montrerons comment y parvenir en utilisant JavaScript.

Configuration

Aux fins de cette documentation, nous avons déjà créé un Schéma d'adresses unique pour le Canada en suivant les étapes de ce tutoriel.

Une fois que nous avons ajouté notre schéma d'adresses supplémentaire, nous avons sélectionné le Schéma pour notre champ d'adresses dans le générateur de formulaires.

En plus de cela, nous avons également activé Activer la saisie semi-automatique d'adresses dans l'onglet Avancé du champ d'adresses.

Ajout de l'extrait

Une fois que vous avez configuré et enregistré votre formulaire, il est temps d'ajouter le extrait de code. Si vous avez besoin d'aide pour ajouter des extraits de code à votre site, veuillez consulter ce tutoriel.

/**
 * Restrict address autocomplete to a specific country
 *
 * @link https://wpforms.com/developers/how-to-restrict-address-autocomplete-to-a-specific-country/
 */
function wpf_dev_geo_autocomplete_default_country() {
    ?>
    <script type="text/javascript">
        var formID = '1000';        // Change form ID
        var addressFieldID = '25';  // Change address field ID
        var country = 'ca';         // Change country code
        var settingsKey = 'wpforms_' + formID + '_field_' + addressFieldID;
        if ( typeof wpforms_geolocation_settings !== 'undefined' ) {
            if ( ! wpforms_geolocation_settings.autocompleteSettings ) {
                wpforms_geolocation_settings.autocompleteSettings = {};
            }
            if ( ! wpforms_geolocation_settings.autocompleteSettings[ settingsKey ] ) {
                wpforms_geolocation_settings.autocompleteSettings[ settingsKey ] = {};
            }
            wpforms_geolocation_settings.autocompleteSettings[ settingsKey ].strict = [ country ];
        }
    </script>
    <?php
}
add_action( 'wpforms_wp_footer_end', 'wpf_dev_geo_autocomplete_default_country', 30 );

Trois éléments doivent être mis à jour dans l'extrait de code pour correspondre à vos besoins spécifiques.

1. var formID = 1000;
2. var addressFieldID = 25;
3. ‘country’: [ ‘ca’ ],

Ceux-ci devront être mis à jour pour correspondre à votre propre ID de formulaire, ID de champ et au pays dans lequel vous souhaitez que la saisie semi-automatique d'adresses recherche uniquement.

Pour trouver vos ID de formulaire et de champ, veuillez consulter ce tutoriel.

Pour obtenir de l'aide afin de trouver le code pays à 2 lettres pour votre pays spécifique, veuillez consulter cette documentation.

C'est tout ! Désormais, lorsqu'une adresse est saisie, la fonction de saisie semi-automatique ne recherchera que dans le pays que vous avez spécifié.

Souhaitez-vous également restreindre le champ Téléphone à un pays spécifique ? Consultez notre article sur Comment restreindre les pays dans les champs de téléphone intelligents.

Articles associés

Référence d’action : wpforms_wp_footer_end