Skip to content

EditForm

EditForm

Nom fonctionnel: EditForm

À quoi sert ce widget ?

EditForm complète le viewer avec un comportement métier directement exploitable par vos utilisateurs.

Conseil: un viewer “trop outillé” devient vite bruyant. Activez ce widget uniquement s’il sert un parcours utilisateur clair.

Quand l’activer

  • Quand vous devez simplifier le parcours utilisateur.
  • Quand vous voulez adapter le viewer à plusieurs profils (langue, thème, action).
  • Quand la lisibilité des commandes est un enjeu métier.

En clair

  • Côté utilisateur: Une interface claire réduit les erreurs de manipulation et accélère la prise en main.
  • Côté intégration: Contrôlez les conteneurs, les libellés i18n et la cohérence visuelle globale.

Prise en main

Accéder au widget

  • Ouvrez le widget depuis la toolbar ou le conteneur dédié.
  • Vérifiez sa position dans l’interface pour éviter les conflits de lisibilité.

Le configurer sans se tromper

  • Configurez titre, icône, langue ou apparence selon le contexte.
  • Validez le comportement attendu en desktop et mobile.

Ce que l’utilisateur voit

  • Composants d’interface (boutons, panneaux, titres, états visuels).
  • Paramètres d’accessibilité et de lisibilité.
  • Interactions contextuelles avec les autres widgets.

Parcours utilisateur (le plus courant)

  • Activez l’outil UI pour guider l’utilisateur dans son parcours.
  • Ajustez les éléments visuels pour clarifier les actions disponibles.
  • Contrôlez l’impact sur le reste de l’interface.

Exemples concrets

  • Ajouter un bouton d’action métier dans une toolbar existante.
  • Basculer de langue pour un public multilingue.
  • Adapter l’habillage visuel via un thème dédié.

Configuration (aperçu)

OptionTypeDéfautDescription
widgetIdstring-Identifiant unique de l’instance EditForm.
activebooleanfalseActive l’ouverture du widget au démarrage.
inToolbarboolean ou objet ou stringselon widgetDéfinit si le widget est visible dans une toolbar, et sous quelle forme.
containerstring ou objetselon widgetChoisit le conteneur de rendu (drawer, dialog, floating, toolbar-tabs, hidden).

Pour le détail complet (et toujours à jour), utilisez la référence technique et le schéma ci-dessous.

Liens techniques et code

Exemple minimal (copier-coller)

{
"widgetId": "edit-form",
"widgetClass": "EditForm",
"active": false,
"inToolbar": true,
"config": {}
}

Exemple avancé

{
"widgetId": "edit-form-advanced",
"widgetClass": "EditForm",
"active": true,
"handleOpenAtStartup": false,
"inToolbar": {
"type": "button",
"toolbarId": "default-toolbar",
"order": 10
},
"onActivate": {
"deactivate": {
"classes": []
}
},
"config": {}
}

Points d’attention

  • Un widget UI mal positionné peut devenir invisible pour l’utilisateur.
  • Des libellés non traduits dégradent fortement l’expérience.
  • L’ordre des actions en toolbar influence la compréhension du parcours.

Dépannage

SymptômeVérification rapide
Le widget n’apparaît pas au bon endroit.Vérifiez inToolbar, container et viewer.containers.
Le texte affiché n’est pas traduit.Vérifiez les clés i18n et la langue active.

FAQ

Peut-on personnaliser les icônes et titres ?

Oui, via icon, title et les clés i18n quand le widget le permet.

Comment éviter une toolbar surchargée ?

Priorisez les actions clés et regroupez par famille.

Captures à ajouter

  • (Capture à ajouter) /assets/screenshots/TODO/edit-form-01.png: widget ouvert avec configuration standard.
  • (Capture à ajouter) /assets/screenshots/TODO/edit-form-02.png: interaction principale et résultat attendu.

Liens PDF source

  • Aucun PDF de référence détecté automatiquement pour ce widget.

Aller plus loin