Url_button

Description

Le Bouton (button) est un élément interactif permettant de déclencher des actions utilisateur. Il supporte l'événement on-click pour appeler des fonctions WebFormController, renderFunction ou des fonctions ORDA sur une table.

Il peut afficher un libellé texte, une icône Bootstrap Icons, ou les deux. Plusieurs styles prédéfinis sont disponibles (primary, secondary, accent, ghost, etc.) basés sur DaisyUI.

Propriété	Champ technique	Type	Description
Libellé	vt_FieldLabel	text	Texte affiché sur le bouton
Libellé 4D	vt_FieldLabel4D	text	Libellé dynamique via expression 4D
Cacher le libellé	vb_DisplayLabel	checkbox	Masque le texte du bouton
Bulle d'aide	vt_HelpTip	text	Contenu du tooltip au survol
Position tooltip	vt_HelpTipPosition	select	top, bottom, left, right
Type	vt_Type	select	Style DaisyUI du bouton
Icône	vt_Icon	hidden	Icône Bootstrap Icons (sélecteur visuel)
Cacher icône	vb_DisplayIcon	checkbox	Masque l'icône
Icône à droite	vb_ReverseIcon	checkbox	Place l'icône à droite du texte
Sans fond	vb_IsOutline	checkbox	Style outline sans fond
Confirmation	vt_MessageConfirm	text	Message de confirmation avant action

Valeurs du type (vt_Type)

btn-neutral — Neutre (gris foncé)
btn-primary — Primaire (couleur principale du thème)
btn-secondary — Secondaire
btn-accent — Accent
btn-ghost — Transparent (fond visible au survol)
btn-link — Style lien hypertexte
btn-success — Vert (succès)
btn-warning — Orange (avertissement)
btn-error — Rouge (erreur)
btn-info — Bleu (information)

Événement supporté : on-click — Déclenché au clic sur le bouton. Configure une classe (WebFormController, renderFunction ou table ORDA) et une fonction à exécuter.

Paramètre

Libellé du bouton

Champ technique : vt_FieldLabel (type text)

Permet de configurer le texte qui apparaîtra sur le bouton. Ce libellé est affiché directement dans l'élément button HTML.

Un second champ vt_FieldLabel4D permet de définir un libellé dynamique calculé côté serveur via une expression 4D (ex: formule, variable process).

Cacher

Champ technique : vb_DisplayLabel (type checkbox)

Lorsque cette option est cochée, le texte du libellé est masqué visuellement. Le bouton n'affichera alors que son icône (si une icône est configurée). Utile pour créer des boutons compacts avec icône seule.

Type du bouton

Champ technique : vt_Type (type select)

Sélectionne le style visuel du bouton parmi les variantes DaisyUI :

btn-neutral — Neutre (gris foncé)
btn-primary — Primaire (couleur principale du thème)
btn-secondary — Secondaire
btn-accent — Accent
btn-ghost — Transparent (fond visible au survol)
btn-link — Style lien hypertexte
btn-success — Vert (succès)
btn-warning — Orange (avertissement)
btn-error — Rouge (erreur)
btn-info — Bleu (information)

Sélection d'icône (remplace le contenu de la cellule)

Champ technique : vt_Icon (type hidden)

Ouvre un sélecteur visuel permettant de choisir une icône parmi la bibliothèque Bootstrap Icons. L'icône sélectionnée est stockée sous forme de classe CSS (ex: bi-check, bi-arrow-right). Elle s'affiche à gauche du libellé par défaut.

Cacher l'icône

Champ technique : vb_DisplayIcon (type checkbox)

Masque l'icône sélectionnée. Le bouton n'affichera alors que son libellé texte. Utile pour désactiver temporairement l'icône sans la supprimer de la configuration.

Icône à droite

Champ technique : vb_ReverseIcon (type checkbox)

Par défaut, l'icône est placée à gauche du libellé. En cochant cette option, l'icône est déplacée à droite du texte. Utilise un flex-direction: row-reverse sur le contenu du bouton.

Sans fond

Champ technique : vb_IsOutline (type checkbox)

Active le style outline du bouton : supprime la couleur de fond et ajoute une bordure à la place. La couleur de la bordure correspond au type de bouton sélectionné. Ajoute la classe CSS btn-outline de DaisyUI.

Message de confirmation

Champ technique : vt_MessageConfirm (type text)

Lorsqu'un message est saisi, un popup de confirmation apparaît quand l'utilisateur clique sur le bouton. L'action (événement on-click) ne s'exécute que si l'utilisateur confirme. Le message supporte les clés de traduction pour les sites multilingues.

Mise en page

Champ technique : customClass (dans l'onglet Mise en page > Classes personnalisées)

Permet d'appliquer des classes Tailwind CSS directement sur l'élément <button>. Exemples courants :

btn-sm, btn-lg, btn-wide — Tailles DaisyUI
w-full — Bouton pleine largeur
gap-2 — Espacement entre icône et texte
rounded-full — Bouton rond

L'onglet Mise en page complet (Disposition, Dimensions, Espacement, Bordure, Typographie, Ombres, Arrière-plan) est identique pour tous les types d'objets BWEB. Voir la documentation Mise en page.