Masque - nombre de caractères libre

Bonjour,

Je souhaite mettre une unité à mon champs de saisie (ex. kg). De façon à ce que lorsque l'utilisateur remplira le champs il pourra voir s'afficher 15 kg ou 100kg ou encore 4kg.

Avec par exemple, le masque ## kg ou ### kg j'oblige l'utilisateurs à rentrer un nombre de caractères définis. Il ne pourra donc pas en entrer plus ou moins.

Avez vous une solution pour utiliser un format kg en laissant la liberté du nombre de caractères ?

Merci par avance de votre aide.

Bonjour apresventehondafr,

Merci de contacter l'assistance Jotform. Effectivement, ce n'est pas possible de spécifier, pour un élément Texte Court, le type de caractère et un unité sans spécifier le nombre de caractères souhaité. Une alternative est d'utiliser l'élément Chiffre qui oblige à taper un nombre, et de spécifier l'unité dans la sous-étiquette du champ, comme suit:

Vous pouvez aussi préférer utiliser l'étiquette, changer la largeur du champ et injecter un code CSS, tel que celui-ci, à adapter selon votre formulaire.

.form-label.form-label-top {

  position : fixed;

  margin-left : 120px;

}

Ce qui donnerait, par exemple, après avour réglé la largeur du champ dans les options de réglages de l'élément chiffre:

Si cette solution peut vous convenir, ce guide explique Comment injecter du code CSS personnalisé. Nous pouvons aussi vous aider à le personnaliser si vous nous communiquez le formulaire en question. Sinon, je peux faire une demande de fonctionnalité auprès de nos développeurs, mais je ne pourrai pas vous dire quand elle sera disponible.

N'hésitez pas à revenir vers nous si vous avez encore besoin d'aide. 

Je n'arrive pas à ajouter le CSS. Pourriez vous l'ajouter comme proposé au champs "Poids total du et/ou des colis" ? https://eu.jotform.com/build/243182397797069?iak=d7198f7dc397586b5b553ddcfb5cc2a6-5107e95c9743a0fa

Je vais par la suite m'inspirer du code que vous aurez rentrer en dans la section CSS

Merci

Cher apresventehondafr,

j'ai besoin d'un peu de temps pour ce faire. Je reviens vers vous aussitôt que possible avec une solution. Merci de votre patience et de votre compréhension, que nous apprécions. 

Cher apresventehondafr,

Voici comment procéder, ainsi vous pourrez adapter par vous-même au besoin.

Comme l'étiquette servira à indiquer l'unité, ajoutons d'abord un paragraphe qui servira d'étiquette.

1. Dans le Générateur de Formulaires, ajoutez l'élément Paragraphe depuis le panneau de gauche.
2. Après avoir double-cliqué sur le paragraphe pour l'éditer, réglez la taille des caractères à 12 points depuis la barre d'outil texte.
3. Et la couleur du texte, en noir.
4. Ajoutez ensuite l'élément Chiffre, avec pour étiquette l'unité.
5. Cliquez sur son Engrenage.
6. Et dans le panneau de droite, allez à l'onglet Avancés, puis allez tout en bas de l'onglet.
7. A la section Détail du champ, cliquez sur la flèche à droite.
8. Et notez l'ID du champ.
9. Ensuite, fermez l'onglet et, dans le Générateur de Formulaires,  cliquez sur le Rouleau de peinture en haut à droite.
10. Et, enfin, dans le panneau de droite, allez à l'onglet Styles.
11. Et coller le code CSS ci-dessous dans la section Injecter du CSS personnalisé. Comme vous pouvez le voir, la position du label est mise à jour en conséquence.

Le code étant ici le suivant:

#input_7 {

  margin-top: -50px;

}



#label_7 {

    position: absolute;

    left: 0;

    top: -40px;

    left: calc(50% - 5px);

}

où #label_7 reprend le même nombre que celui l'ID du champ noté à l'étape 8 (#input_7), la taille de la marge haute du champ permettant de rapprocher ce champ du paragraphe.

Si vous souhaitez, vous pouvez cloner le clone que j'ai moi-même fait de votre formulaire pour cet exemple.

Faites un essai et dites-nous comment ça se passe.