Tutoriel : Ajout d'une validation à une zone du formulaire d'inscription

Vous pouvez ajouter une validation supplémentaire à une zone pour aider les utilisateurs du portail de développeur . Par exemple, vous pouvez souhaiter valider un nom de service, un ID employé ou d'autres données de ce type lorsqu'un utilisateur s'inscrit pour un compte sur le portail.

Avant de commencer

Un portail de développeur doit être activé et vous devez disposer d'un accès administrateur pour exécuter ce tutoriel. Vous devez avoir terminé le tutoriel sur l' ajout d'une zone au formulaire d'inscription, dans lequel vous avez ajouté une zone Department code au formulaire d'inscription.

A propos de ce tutoriel

Dans ce tutoriel, vous ajoutez une validation à la zone Department code du formulaire d'inscription. Ce champ est obligatoire pour tous les utilisateurs du portail et se présente sous la forme d'une chaîne au format DEPnnn, où DEP correspond au préfixe de la chaîne et nnn est un nombre à trois chiffres, par exemple DEP123. La validation est effectuée à l'aide d'un module personnalisé qui est déjà disponible dans IBM APIC Portal-addons. Toutefois, pour plus d'informations, voir Développement de module personnalisé: création d'un squelette de module.

Ce tutoriel vous guide à travers les étapes suivantes :
  1. Clonage et conditionnement du module de validation.
  2. Installation et activation du module de validation.
  3. Test de la validation dans le formulaire d'inscription.

Regardez les fichiers que nous allons utiliser dans ce lien IBM APIC Portal - addons.

  • user_field_example.info.yml - Ce fichier contient les métadonnées du module définissant des éléments tels que le nom et la version et contenant d'autres informations importantes requises par Drupal pour importer et activer le module.
    name: 'IBM APIC Portal - user field example'
type: module
description: 'IBM API Connect Developer Portal tutorial - Example of validating a custom user field'
package: 'Custom'
core_version_requirement: ^8 || ^9 || ^10 || ^11
version: 1.0.0
project: 'user_field_example'
dependencies:
  - ibm_apim
  - auth_apic
  • user_field_example.module - Ce fichier contient une fonction de validation et l'ajoute au formulaire d'inscription à l'aide de la fonction hook_form_alter.
    <?php
use Drupal\Core\Form\FormStateInterface;

/**
 * Implementation of hook_form_alter() to alter the Sign up form
 */
function user_field_example_form_alter(&$form, FormStateInterface $form_state, $form_id) {
  if ($form_id === 'user_register_form' ) {
      $form['#validate'][] = 'user_field_example_validate_department_code';
  }
}

/**
 * Validate the Department code field on the Sign up form.
 *
 * Valid entry = DEPnnn
 *   where n = single figure digit.
 */
function user_field_example_validate_department_code($form, &$form_state) {
  $dept_code = $form_state->getValue('field_department_code')[0]['value'];
  $valid = preg_match('/^DEP\d{3}$/', $dept_code);
  if (!$valid) {
    $form_state->setErrorByName('field_department_code', t('Invalid department code.'));
  }
}

Clonage et conditionnement du module de validation

La validation est ajoutée à la zone Department code du formulaire d'inscription à l'aide d'un module personnalisé.

  1. Clonez le module personnalisé. Voici un exemple de commande si vous utilisez Mac et Linux :
    git clone https://github.com/ibm-apiconnect/cmsportal-addons
  2. Conditionnez le module personnalisé.
    cd devportal-addons/apic_v10/modules
tar -czf user_field_example.tgz user_field_example/

Installation et activation du module de validation

  1. Connectez-vous à votre portail de développeur en tant qu'administrateur.
  2. Cliquez sur Prolonger > Prolonger.
  3. Cliquez sur + Ajouter un nouveau module.
  4. Dans la section Télécharger un module ou une archive de thème, cliquez sur Parcourir le fichier.
  5. Accédez au fichieruser_field_example.tgz, le module personnalisé conditionné que vous avez précédemment créé, et sélectionnez-le. Cliquez sur Ouvrir.
  6. Cliquez sur Continuer.
  7. Cliquez sur le lien Activation des modules nouvellement ajoutés.
  8. Saisissez le site IBM APIC Portal - user field example dans le champ de filtre.
  9. Cochez la case " IBM APIC Portal - user field example
  10. Cliquez sur Activer.

Le module est maintenant installé et activé.

Test de la validation dans le formulaire d'inscription

  1. Fermez la session en tant qu'administrateur.
  2. Cliquez sur Créer un nouveau compte.
  3. Saisissez les informations nécessaires dans tous les champs, définissez le " Department code sur le " ABC123.
  4. Cliquez sur S'inscrire.
  5. Observez le message d'échec et la mise en évidence dans la zone Department code .Zone de code de service
  6. Remplacez la valeur de la zone Department code par DEP245, entrez à nouveau le mot de passe et cliquez sur Sign up pour vérifier qu'un code valide est accepté.

Tâches exécutées dans ce tutoriel

Vous avez ajouté des éléments de validation à la zone Department code du formulaire d'inscription, puis testé le formulaire afin de vérifier que la zone Department code n'accepte que des codes au format DEPnnn.

En réalité, vous devez ajouter cette configuration de manière à ce qu'elle soit disponible pour tous les sites. Pour y parvenir, vous devez inclure la configuration à votre module personnalisé. Pour plus d'informations, voir Modules personnalisésDrupal.