Limitation du nombre d'entrées de formulaire

Cette nouvelle fonctionnalité qui permet de limiter le nombre de soumission de formulaire nécessite une migration graphique

Explications du nouveau code HTML

Avant tout le contenu du formulaire se situait dans un unique <div> sous la balise <form>

<form>
    <div>
        ...

Maintenant

<form>
    <div data-ametys-form="form">
        ...

Et si la limitation est activée de nouvelles balises sont ajoutées avant.

<form data-ametys-form-state="loading|open|closed[error">
    <div class="form-limit-loading"></div>
    <p data-ametys-form-fill="starterror-text">...</p>
    <p data-ametys-form-fill="closed-text">...</p>
    <p data-ametys-form-fill="limit-text">...</p>
    <div data-ametys-form="form">
        ...
  • l'attribut data-ametys-form-state de la balise <form> donne l'état actuel du fomulaire :
    • loading => chargement de l'état en cours
    • open => le formulaire est ouvert à la soumission. Le texte indiquant le nombre de places disponibles doit être affiché.
    • closed => le formulaire n'as plus de places disponibles. Le texte indiquant que le formulaire est fermé doit être affiché.
    • error => le chargement a échoué. Le texte d'erreur doit être affiché.
  • <div class="form-limit-loading"></div> est une pastille de chargement en cours : le temps de charger l'état ouvert ou fermé du formulaire en ajax. Doit être affichée si l'état est loading.
  • <p data-ametys-form-fill="starterror-text"> est un message d'erreur si le chargement de de l'état du formulaire échoue. Doit être affiché si l'état est error.
  • <p data-ametys-form-fill="closed-text"> est le message affiché si le formulaire est fermé aux soumissions. Doit être affichée si l'état est closed.
  • <p data-ametys-form-fill="limit-text"> est le message affiché si le formulaire est ouvert aux soumissions. Doit être affichée si l'état est open.

A faire

Les chartes noyau Doc, Workspaces ou ODF contiennent déjà cette migration ; si vous en héritez vous n'avez rien à faire

Docbook2html

Vérifier dans vos xsl docbook2html.xsl que le template suivant n'existe pas

<xsl:template match="html:form">

Si jamais il existe, appliquez la modification comme sur le noyau.
Vous noterez qu'une partie du code js a été déplacé dans un fichier javascript à côté ; et vous n'avez pas besoin d'ajouter le template handle-limit mais juste l'appeler.

Nouvelles classes CSS minimales

Il faut gérer le chargement ainsi que les messages.
Le plus simple est d'importer la CSS suivante dans tous vos contenus qui disposent de richtext ou de vous en inspirer.

Selon les projets, vous disposez déjà d'une css importée sur tous les contenus, par exemple : content.css ou richtext.css.
Posez les fichiers forms.css et loader.svg à côté de cette css et ajouter tout en haut l'instruction : @import url('forms.css');

La nouvelle structure html peut éventuellement entrainer des interactions entre vos anciennes CSS et la limitation d'accès : il est donc important de vérifier l'aspect de vos formulaires sans et avec la limitation.

Retour en haut

Forms