Blog OneSpan

OneSpan Sign Developer: Création d'un champ de boutons radio

Développeurs
Duo Liang, septembre 26, 2018
Thumbnail

Lorsque vous créez des transactions, vous pouvez capturer des informations de votre destinataire pendant la cérémonie de signature. Avec OneSpan Sign, vous pouvez le faire en plaçant des champs, tels que des champs de texte et des cases à cocher, sur vos documents.

 

Dans ce blog, nous allons plonger dans le champ de bouton radio, comment le créer à la fois dans la méthode SDK et REST, et des considérations importantes lors de la création d'un bouton radio. Sans plus tarder, commençons.

 

 

Champ de bouton de radio

 

L'un des types de champ les plus courants dans OneSpan Sign sont les boutons radio. Ils peuvent être regroupés en associant chacun avec un nom de groupe commun. Au sein d'un groupe, vous avez la capacité d'exiger de votre signataire qu'il fasse une sélection et présélectionne un bouton radio par défaut.

 

 

Après la cérémonie, le bouton radio sélectionné sera répliqué par un "X" sur le document après qu'il a été traité par OneSpan Sign.

 

 

Exemple SDK

 

Voici quelques extraits sDK vous montre comment créer un champ de bouton radio:

 

 

Version Java:

 

 

Radio de champ1 - FieldBuilder.radioButton (« groupe1 »)
               .withId (nouveau FieldId("signer1_group1_radio1"))
               .withName(("signer1_group1_radio1")
                 .withSize(15,15)
                 .onPage(0)
                 .atPosition(100 100)
                   .withValue(vrai) //sélectionné par défaut
                   .withValidation(FieldValidatorBuilder.basic().requis()) //ajouter un validateur requis
                .construire();

.Net version:

 

 

Radio de champ1 - FieldBuilder.RadioButton (« groupe1 »)
                         . WithId (("signer1_group1_radio1")
                       . WithName (("signer1_group1_radio1")
                         . WithSize(15,15)
                         . OnPage(0)
                         . AtPosition (100 100)
                         . AvecValue (vrai) //sélectionné par défaut
                         . WithValidation (FieldValidatorBuilder.Basic(). Requis()) //ajouter un validateur requis
               . Build ();

Comme nous l'avons mentionné ci-dessus, plusieurs boutons radio peuvent partager un même nom de groupe, et ce groupe ne peut être lié qu'à un seul signataire. L'Id de champ est suggéré à la suite d'une convention de nommage significative.

 

 

Par défaut, les signataires ne sont pas tenus de faire une sélection. Si vous souhaitez forcer votre signataire à le faire, ajoutez un Validateur de champ requis sur le terrain afin qu'il ajoute un champ "requis" dans votre domaine JSON. Avec plusieurs champs dans un groupe, cette ligne n'a besoin que d'être ajoutée à l'un d'eux, mais nous vous recommandons de l'ajouter à tous les champs.

 

 

Afin de présélectionner l'un des combos, vous pouvez définir votre valeur de champ par vrai/"vrai"/"x"/"X", en comparant avec faux/"faux"/"" pour commencer à être désélectionné. Puisque nous utilisons un SDK, il est suggéré d'utiliser simplement un paramètre Boolean vrai pour empêcher l'entrée d'erreur. Si vous avez par erreur définir des valeurs réelles pour plusieurs boutons dans un groupe, OneSpan Sign reconnaîtra le dernier champ ajouté comme un champ sélectionné par défaut.

 

 

Exemple REST

Un exemple JSON créant un champ de bouton radio, qui est équivalent au code SDK ci-dessus, montre comme ci-dessous:

{
   "id":"signer1_group1_radio1",
   "nom":"signer1_group1_radio1",
   "type":"INPUT",
   "sous-type":"RADIO",
   "page":0,
   "hauteur":15,
   "largeur":15,
   "gauche":100,
   "top":100,
   "valeur":"X",
   "validation":
      "requis":vrai,
      "enum":[
         "groupe1"
      ]
   }
}

Comme vous pouvez le voir, afin de donner un champ d'informations supplémentaires, attribut requis, et votre nom de groupe de radio sont mis dans l'attribut "validation".

 

 

Fait intéressant

 

Si vous utilisez REST pour développer votre application et que vous souhaitez récupérer les métadonnées des boutons radio dans votre package JSON (GET /api/packages/packageId), vous devez inclure le paramètre d'en-tête suivant pour profiter des champs de formulaire s'étendez :

 

 

Accepter : application/json; esl-api-version 11,18 (toute version après 10,6)

Alors que, si vous utilisez l'appel API (GET /api/packages/packageId/approvals/'approvalId) pour récupérer vos métadonnées d'approbation, vous n'avez pas besoin de porter ce paramètre d'en-tête. En bref, il est recommandé de porter ce pour garder le même en-tête de demande que SDK ne. (Dans SDK, ce paramètre est ajouté par défaut)

 

 

Vous pouvez vous référer à Release Note 10.6.1 pour plus d’informations.

 

 

Avec méthodes d'extraction

 

Actuellement, le type de bouton radio n'est pas encore pris en charge dans L'extraction de documents. Par conséquent, nous choisirons L'extraction de position pour localiser tous nos champs, ainsi que la fonction d'injection de champ pour remplir les informations du signataire pour construire notre exemple de démonstration.

 

 

Les noms de champs de forme sur les champs sont affichés dans l'image de gauche ci-dessous. Vous pouvez trouver la capture d'écran du document signé sur la droite.

9-26-1

L'exemple est basé sur Java SDK et ce sont le code de base auquel vous pouvez vous référer lorsque vous utilisez également la fonction d'extraction de position et d'injection de champ :

 

 

DocumentPackage documentPackage - PackageBuilder.newPackageNamed("Test Package with Radio Button Fields")
          .withSigner(SignerBuilder.newSignerWithEmail(signerInfo.get("email")).withCustomId("signer1")
              .withFirstName (signerInfo.get("firstname")).withLastName (signerInfo.get("lastname"))
          .withDocument(DocumentBuilder.newDocumentWithName("Contrat d'échantillon")
              .fromFile ("votre chemin de fichier")
              .enableExtraction()
              .withSignature(SignatureBuilder.signatureFor(signerInfo.get("email"))
                  .withPositionExtracted().avecName ("signer1_fullname1")
                  .withField(FieldBuilder.signatureDate().avecPositionExtraitd()
                      .withName ("signer1_fullname1_date"))
                  .withField (radio1).withField (radio2).withField (radio3))
              .withInjectedField(FieldBuilder.textField().avec Name("signer1_name")
                  .withValue (signerInfo.get("firstname") " " - signataireInfo.get ("nom de famille"))
              .withInjectedField(FieldBuilder.textField().avec Name("signer1_email")
                  .withValue (signerInfo.get("email"))
              .withInjectedField (FieldBuilder.textField().avec Name("signer1_phone")
                  .withValue (signerInfo.get("téléphone"))
              .withInjectedField (FieldBuilder.textField().avec Name("signer1_address")
                  .withValue (signerInfo.get("adresse")))
          .construire();
      PackageId packageId - eslClient.createPackageOneStep (documentPackage);

Vous pouvez trouver le code complet et le document que j’utilisais dans l’exemple ici.

 

 

Grâce au blog d'aujourd'hui, nous nous familiarisons avec l'utilisation commune de Radio Button Field. En appliquant l'extraction de position au bouton radio, nous pouvons effectivement construire une transaction avec elle.

 

 

Si vous avez des questions concernant ce blog ou toute autre chose concernant l'intégration de OneSpan Sign dans votre application, visitez les Forums communautairesdes développeurs . Vos commentaires sont importants pour nous!

Duo Liang
Duo Liang
Haut de page
Partager