Centre d'assistance

Langage de script d’une enquête (“CSL”)

Pas de commentaire

CheckMarket offre un langage de script très puissant pour améliorer vos rapports, appelé le CheckMarket Scripting Language ou CSL.

À son niveau le plus élémentaire, le CSL est facile à utiliser. Vous pouvez l’utiliser pour ajouter des variables à vos enquêtes et rapports en les sélectionnant d’un menu déroulant.

À son niveau le plus avancé, notre langage de script vous donne une énorme liberté pour utiliser une logique complexe en vue de faire des calculs, de montrer ou de cacher certains blocs de texte ou d’images et beaucoup plus. Alors, mettez votre casquette de mathématicien et allons au fond des choses …

Concepts de base

Syntaxe

Les variables dans le langage de script sont entourées de doubles accolades, comme ceci : {{nomDuVariable}}. Elles sont insensibles à la casse, alors {{NomDuVariable}} est identique à {{nomDuVariable}}.

Hiérarchie

Les variables sont hiérarchiques, vous pouvez donc les parcourir en utilisant la notation par points. Voici quelques exemples :

  • Titre du rapport : {{report.title}}
  • Titre du filtre du rapport : {{report.filter.title}}
  • Titre du premier élément du rapport : {{report.elements.1.title}}
  • Titre de l’élément avec ID 123: {{report.elements.id-123.title}}
  • Etiquette de la première option de réponse de la question de la première source de données du premier élément de rapport : {{report.elements.1.data.1.question.answeroptions.1.label}}

Variables

Où pouvez-vous trouver les variables disponibles ?

 

  • Variables du rapport : dans le ReportBuilder, vous pouvez trouver ces variables dans l’éditeur de texte, en utilisant le bouton d’expansion expand icon dans le volet des propriétés sous ‘Commentaire’ à droite. Ici vous trouverez le menu ‘Variables’ :

Opérateurs avancés

Le langage de script soutient plus que juste des variables. En utilisant des opérateurs spéciaux, vous pouvez implémenter votre propre logique. Pour vous donner une idée, voice un exemple :

{{#if (eq element.title "Tableau croisé")}}
  Le titre de cet élément est Tableau croisé.
{{/if}}

Dans l’exemple ci-dessus, nous vérifions si le titre de l’élément est égal à “Tableau croisé”. Si tel est le cas, nous affichons ‘Le titre de cet élément est Tableau croisé’. Si ce n’est pas le cas, rien ne sera affiché.

Liste des opérateurs

Vous pouvez utiliser des opérateurs de bloc pour montrer / cacher du contenu en fonction de votre propre logique.

OpérateurDescription
ifUtilisez l’opérateur if (si) pour montrer du contenu, de manière conditionnelle. Si son argument renvoie false, null, “”, 0 ou [], le contenu ne sera pas visible.
{{#if (and title description)}}
  Ce texte sera seulement visible s'il y a un titre ET une description.
{{/if}}
if + elseSpécifiez le contenu else (autrement) à être affiché si la première condition n’est pas remplie.
{{#if contact}}
  <h1>{{contact.firstName}} {{contact.lastName}}</h1>
{{else}}
  <h1>Répondant inconnu</h1>
{{/if}}
else ifCombinez plusieurs blocs #if en utilisant else if (sinon). Le système évaluera chaque ‘if’ l’une après l’autre (par ordre d’apparence), jusqu’à ce qu’il en trouve une qui est vrai ou jusqu’à ce qu’il atteigne le ‘else’. Une fois que l’un des blocs ‘if’ est vrai, les autres seront ignorés,même s’ils sont également vrais.
{{#if contact}}
  <h1>{{contact.firstName}} {{contact.lastName}}</h1>
{{else if respondent.questions.yourName}}
  <h1>{{respondent.questions.yourName}}</h1>
{{else}}
  <h1>Répondant inconnu</h1>
{{/if}}
unlessUtilisez l’opérateur unless (sauf si) comme l’inverse de l’opérateur if. Son contenu sera affiché si la condition n’est pas remplie (si la valeur est false, null, “”, 0 ou []).
{{#unless response}}
  <h3 class="warning">Attention : Il n'y a pas de réponse !</h3>
{{/unless}}
eachParcourez une liste en utilisant l’opérateur intégré each (chaque). Dans le contenu, vous pouvez utiliser this (ceci) pour référer à l’élément parcouru, ou pour utiliser immédiatement des propriétés sous-jacentes.
<ul>
  {{#each report.elements}}
    <li>{{title}}</li>
  {{/each}}
</ul>
each + elseAvec un opérateur each (chaque), vous pouvez optionnellement fournir une section else (autrement) qui sera affichée seulement si la liste est vide.
{{#each report.elements}}
  <h2>{{title}}</h2>
{{else}}
  <p>Pas d'éléments dans cette liste !</p>
{{/each}}

En utilisant des opérateurs logiques vous pouvez vérifier et comparer des variables. Ces opérateurs sont utilisés le plus souvent endéans des opérateurs de bloc comme #if.

Des opérateurs logiques sont mis entre parenthèses, comme ça : (eq element.title “Tabeau croisé”). Le premier mot est l’opérateur, qui est suivi par les arguments. Les arguments peuvent être des variables, du texte brut ou des nombres. Le texte doit être mis entre des guillemets simples.

OperatorDescription
andUtilisez and (et) si tous les arguments doivent être vrai.
{{#if (and author publisher)}}
  Ce texte est seulement visible s'il y a un auteur ET un éditeur.
{{/if}}
orUtilisez or (ou) si l’un des arguments doit être vrai.
{{#if (or author publisher)}}
  Ce texte est seulement visible s'il y a un auteur OU un éditeur.
{{/if}}
eqUtilisez l’opérateur eq (equal) pour vérifier si deux arguments sont égaux.
{{#if (eq element.title "Tableau croisé")}}
  Le titre de l'élément est Tableau croisé !
{{/if}}
neUtilisez l’opérateur ne (not equal) pour vérifier si deux arguments ne sont pas égaux.
{{#if (ne element.title "Tableau croisé")}}
  Le titre de l'élément n'est pas Tableau croisé !
{{/if}}
ltUtilisez l’opérateur lt (less than) pour vérifier si le premier argument est inférieur au deuxième argument.
{{#if (lt counter 12)}}
  La valeur du compteur ({{counter}}) est inférieure à 12 !
{{/if}}
gtUtilisez l’opérateur gt (greater than) pour vérifier si le premier argument est plus grand que le deuxième argument.
{{#if (gt counter 12)}}
  La valeur du compteur ({{counter}}) est plus grande que 12 !
{{/if}}
leUtilisez l’opérateur le (less or equal) pour vérifier si le premier argument est inférieur ou égal au deuxième argument.
{{#if (le counter 12)}}
  La valeur du compteur ({{counter}}) est inférieure ou égale à 12 !
{{/if}}
geUtilisez l’opérateur ge (greater or equal) pour vérifier si le premier argument est plus grand ou égal au deuxième argument.
{{#if (ge counter 12)}}
  La valeur du compteur ({{counter}}) est plus grande ou égale à 12 !
{{/if}}
containsUtilisez ceci pour vérifier si le texte du premier argument, contient le second argument.
{{#if (contains element.title "heureux")}}
Le titre de l'élément contient le mot "heureux".
{{/if}}

Utilisez des opérateurs mathématiques pour travailler avec des nombres. Vous pouvez faire des calculs ou réguler comment les nombres sont présentés.

OperatorDescription
addAdditionnez deux nombres ou plus.
10 + 5 = {{add 10 5}}
Résultat : 10 + 5 = 15
subtractSoustrayez deux nombres ou plus.
10 - 5 = {{subtract 10 5}}
Résultat : 10 - 5 = 5
multiplyMultipliez deux nombres ou plus.
10 * 5 = {{multiply 10 5}}
Résultat : 10 * 5 = 50
divideDivisez deux nombres ou plus.
10 / 5 = {{divide 10 5}}
Résultat : 10 / 5 = 2
averageAverage two or more numbers.
The average of the numbers 1,2,3,4 = {{average 1 2 3 4}}
Result: (1+2+3+4) / 4 = 2.5
sqrtPrenez la racine carrée d’un nombre.
La racine carrée de 25 est {{sqrt 25}}
Résultat : La racine carrée de 25 est 5
powCalculez le premier argument élevé à la puissance du deuxième argument.
Trois à la puissance de deux est {{pow 3 2}}
Résultat : Trois à la puissance de deux est 9
modCalculez le reste après avoir divisé le premier argument par le second.
5 % 4 = {{mod 5 4}}
Résultat : 5 % 4 = 1
absObtenez la valeur absolue d’un nombre.
La valeur absolue de -10 est {{abs -10}}
Résultat : La valeur absolue de -10 est 10
roundArrondissez un nombre au nombre de chiffres spécifié. Si aucun nombre de chiffres n’est spécifié, le nombre est arrondi à 0 chiffres.
La première valeur arrondie est {{round 25.9999}},
la deuxième est {{round 12.123456 2}}
Résultat : la première valeur arrondie est 26,
la deuxième est 12.12
randomGénérez un nombre aléatoire entre les nombres spécifiés.
Un nombre aléatoire entre 5 et 10 est {{random 5 10}}
Résultat : Un nombre aléatoire entre 5 et 10 est p.ex. 8
random + excludeGénérez un nombre aléatoire, en excluant certaines valeurs. Vous pouvez exclure autant de valeurs que vous souhaitez.
Un nombre aléatoire entre 5 et 10,
à l'exclusion de 7 et 8, est p.ex. {{random 5 10 7 8}}
Resultat : Un nombre aléatoire entre 5 et 10,
à l'exclusion de 7 et 8 est p.ex. 9
countObtenez un compte du nombre d’éléments dans une liste (array).
Il y a {{count report.elements}} éléments dans ce rapport
Résultat : Il y a 3 éléments dans ce rapport
kFormatez un nombre en notation K.
{{k 12468}}
Résultat : 12K
decChoisissez explicitement le séparateur décimal.
{{dec 12.3 ","}}
Résultat : 12,3

Utilisez des opérateurs de date pour afficher ou manipuler les dates et les heures.

OpérateurDescription
currentDateRetournez la date et le temps actuel dans le format et le fuseau horaire du propriétaire de cette enquête.
Aujourd'hui c'est le {{currentDate}}.
Résultat : Ajourd'hui c'est le 08/17/2000 4:14 PM.
.isoAjoutez cela à n’importe quelle date pour obtenir la date au format ISO. Ce format est lisible par des machines. Utilisez-le pour le pré-remplissage.
Aujourd'hui c'est le {{currentDate.iso}}.
Résultat : Aujourd'hui c'est le 2000-08-17 16:14.
.utcAjoutez-le à n’importe quelle date pour obtenir la date au format ISO 8601 dans le fuseau horaire UTC. Ce format est lisible par des machines. Utilisez-le lors de l’envoi d’une date à une base de données ou à une API.
Aujourd'hui c'est le {{currentDate.utc}}.
Résultat : Aujourd'hui c'est le 2000-08-17T14:14Z.
.dateAjoutez-le à n’importe quelle date pour obtenir seulement la date et non pas le temps.
Ajouterd'hui c'est le {{currentDate.date}}.
Résultat : Aujourd'hui c'est le 08/17/2000.
.timeAjoutez-le à n’importe quelle date pour obtenir seulement le temps et non pas la date.
Le temps maintenant est {{currentDate.time}}.
Résultat : Le temps maintenant est 4:14 PM.
.year
.month
.day
.hour
Ajoutez-le à n’importe quelle date pour obtenir seulement cette partie de la date.
Vous êtes né(e) en {{contact.dateOfBirth.year}}.
Résultat : Vous êtes né(e) en 1970.
dateFormatAffichez une date en utilisant un format spécifié.
Votre date de naissance : {{dateFormat contact.dateOfBirth "MMM d yy"}}
Résultat : Votre date de naissance : Feb 12 87

Quelques exemples des formats que vous pouvez utiliser :

d: 17/08/2000
D: jeudi 17 août 2000
f: jeudi 17 août 2000 16:32
F: jeudi 17 août 2000 16:32:32
g: 17/08/2000 16:32
G: 17/08/2000 16:32:32
m: 17 août
r: Thu, 17 Aug 2000 16:32:32 GMT
s: 2000-08-17T16:32:32
t: 16:32
T: 16:32:32
u: 2000-08-17 16:32:32Z
U: jeudi 17 août 2000 14:32:32
y: août 2000
dddd, MMMM dd yyyy: jeudi, août 17 2000
dddd, MMMM dd: jeudi, août 17
M/yy: 8/00
dd-MM-yy: 17-08-00
dateAddAjoutez un certain intervalle de temps à une date.
Spécifiez la date, le nombre d’unités à ajouter (pour sous-traître, utilisez une valeur négative) et l’unité-même.
L’unité peut être l’une des suivantes (en anglais) : year, month, day, hour, minute et second.
Nous vous répondons avant le
{{dateFormat (dateAdd respondent.dateResponded 3 "day") "D"}}.
Résultat : Nous vous répondons avant le jeudi 17 août 2000.

Attention : la date sera toujours renvoyée en format ISO 8601. Utilisez dateFormat si vous souhaitez l’afficher de manière élégante.

dateDiffCalculez la différence entre deux dates.
Spécifiez la date de début et de fin, ainsi que l’unité. L’unité peut être l’une des suivantes (en anglais) : year, month, day, hour, minute et second.
Nous vous avons invité il y a
{{dateDiff contact.dateInvited currentDate "day"}} jours.
Résultat : Nous vous avons invité il y a 3 jours.

Utilisez des opérateurs de texte pour modifier comment le texte sera montré.

OpérateurDescription
upperCaseConvertez le texte en majuscules.
{{upperCase "un texte"}}
Résultat : UN TEXTE
lowerCaseConvertez le texte en minuscules.
{{lowerCase "Un TEXTE"}}
Résultat : un texte
trimSupprimez les espaces au début et à la fin du texte.
{{trim "  Certain texte  "}}
Résultat : Certain texte
urlEncodeRendez le texte approprié pour les URL.
{{urlEncode "Certain texte ?"}}
Résultat : Certain%20texte%3F

Ceci devrait être utilisé lors de l’utilisation de variables dans des URL pouvant contenir des espaces, des barres obliques ou d’autres caractères spéciaux. Les nombres n’ont pas besoin d’être encodés en url.
Utilsez ce paramètre par exemple dans un branchement vers une URL externe ou dans un lien placé sur la page de remerciement.

Utilisez des fenêtres modales et des popovers pour afficher des informations supplémentaires lorsque le répondant clique sur un lien. Utilisez des fenêtres modales pour un texte ou des images plus longs, utilisez des popovers pour de petites informations ou pour expliquer un mot.

Remarque : ces opérateurs ne sont supportés que dans l’interface d’enquête et dans les rapports.

OpérateurDescription
iconAffichez une petite icône. Specifiez un identifiant de Font Awesome.
{{icon "far fa-star"}}

Résultat :

modalAffichez un lien pour ouvrir une fenêtre modale.
Cliquez {{modal "ici" "Ce texte est à l'intérieur de la fenêtre modale"}}
pour plus d'informations.
Résultat : Cliquez ici pour plus d'informations. 
Résultat endéans la fenêtre modale : Ce texte est à l'intérieur de la fenêtre modale.

L’ajout d’une icône est également possible.

Cliquez {{modal "ici" "texte de la fenêtre modale." icon="fas fa-info-circle"}} !

Si votre texte à l’intérieur de la fenêtre modale est long, vous pouvez également utiliser la variante #modal :

{{#modal "click here"}}
Ce texte est plus long et peut contenir des balises,
des guillemets et des variables.
{{/modal}}
tooltipAffichez une info-bulle ou une bulle de texte lorsque vous déplacez votre souris sur quelque chose.
Ceci est une question {{tooltip "NPS" "Net Promotor Score"}}. 
Résultat : Ceci est une question NPS.
Résultat endéans l'info-bulle : Net Promotor Score

Remarque : comme il n’y a pas de souris sur le mobile, l’info-bulle est activée en cliquant dessus.

Par défaut, les info-bulles sont affichées au-dessus du lien. Vous pouvez modifier cette position en spécifiant “left” (gauche), “right” (droite) ou “bottom” (bas).

{{tooltip "Cliquez ici" "Affiché à droite" position="right"}}

L’ajout d’une icône est également possible. Ajoutez comme dernier paramètre, la classe FontAwesome de l’icône que vous voulez utiliser.

{{tooltip "Cliquez ici" "Votre texte" position="top" icon="fas fa-info-circle"}}

Si votre texte dans l’info-bulle est long, vous pouvez également utiliser la variante #tooltip :

{{#tooltip "Cliquez ici"}}
Ce texte peut être plus long et peut contenir
des balises, des guillemets et des variables.
{{/tooltip}}
popoverIdentique à une info-bulle, mais activée uniquement en cliquant, ne pas en déplaçant votre souris dessus.
Ceci est une question {{popover "NPS" "Net Promotor Score"}}. 
Résultat : Ceci est une question NPS.
Résultat endéans popover : Net Promotor Score

 

Voir larticle suivant pour plus d’exemples et d’informations :
Info-bulles, popovers et fenêtres modales

Utilisez des variables temporaires personnalisées pour diviser de grandes fonctions en parties plus petites. Ces variables ne sont enregistrées nulle part, elles ne sont disponibles que temporairement dans la même page.

OpérateurDescription
setEnregistrez une valeur temporaire. Vous devez spécifier un nom et la valeur.
{{set "maSomme" (add 1 2)}}

Pour enregistrer un gros morceau de texte, vous pouvez également utiliser la variante #set :

{{#set "monTexte"}}
Ce texte peut être plus long et peut contenir des balises,
des guillemets et des variables.
{{/set}}

Attention : aucun résultat ne sera affiché à ce moment. Utilisez la fonction dessous pour obtenir cette variable.

getObtenez une valeur temporaire en utilisant le nom que vous avez spécifié avec l’opérateur set.
{{get "maSomme"}}
Résultat : 3

Il est possible d’utiliser du texte formaté et des images (HTML) en combinaison avec CSL. Si vous utilisez des variables qui contiennent du texte contenant du code HTML, le contenu sera affiché en utilisant le format :

{{survey.questions.monEtiquetteDeDonnees.text}}
Exemple du texte avec une partie en italique.

Vous pouvez également supprimer le formatage HTML et afficher tout sous forme de texte brut à l’aide de .unformatted :

{{survey.questions.myDataLabel.text.unformatted}}
Exemple du texte avec une partie en italique.

En outre, vous pouvez approprier tout texte aux URL à l’aide de .urlEncoded :

{{survey.questions.myDataLabel.text.urlEncoded}}
Exemple%20du%20texte%20avec%20une%20partie%20en%20italique.

Vous pouvez combiner tous ces opérateurs pour créer une logique plus avancée. Quelques exemples :

{{#if (lt element.statistics.1.nps element.statistics.2.nps)}}
Votre score NPS est inférieur à celui du groupe entier. Veuillez réviser votre plan d'action NPS.
{{/if}}

Traduction : “Si le NPS de votre région est inférieur au benchmark du groupe entier, montrez un message.” Cela signifierait que cet élément a deux sources de données, toutes deux de la même question NPS, et la deuxième étant définie comme un benchmark. Ainsi, elle ne sera pas affectée par le filtre de partage. La première source de données est affectée par le filtre de partage, ce qui permet cette comparaison

Besoin d’aide ?

Notre langage de script CheckMarket offre d’énormes possibilités qui ne peuvent bien entendu pas toutes être couvertes gratuitement par notre service d’assistance. L’utilisation de notre langage de script (CSL) par vous-même est incluse dans toutes nos formules de prix et nous offrons des services de consultation par un spécialiste aux clients qui en ont besoin.

Voulez-vous créer des enquêtes / rapports avancés, mais le temps vous manque ? Laissez l’un de nos responsables de projet faire la rédaction pour vous !

Demandez une offre

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.