Carnet Wiki

Saisies : faire son marché

Cette page complète la documentation des saisies aux côtés de la documentation des saisies et de la page Saisies : Doc complémentaire.

Une autre page du carnet est spécialement dédiée aux sélecteurs

Voir aussi :
-  La documentation des saisies et la Saisies : Doc complémentaire.
-  Plugin vérifier
-  Le dossier des saisies dans le source du plugin.

Attention, cette page présentait initialement des notes simples, non encore complètement testées... de nombreux contributeurs les complètent peu à peu, et mieux, les corrigent !!

Rappel des paramètres de _base.html

Légende : ** : obligatoire ; * : fortement conseillé.

-  ** nom : identifiant du paramètre
-  * label : nom joli apparaissant dans le formulaire
-  * erreurs : tableau des erreurs, transmis par defaut avec SAISIE
-  * valeur : valeur actuelle du parametre, transmis par defaut avec SAISIE : valeur=#ENV{nom du parametre}}
-  defaut : valeur par defaut du paramètre
-  obligatoire : est-ce un paramètre obligatoire ? defaut : non ; valeurs : null / « non » / autre=oui
-  info_obligatoire : si obligatoire, ajoute ce contenu apres le label (defaut : «  »)
-  explication : texte d’explication suppplementaire
-  attention : texte pour les cas graves !
-  disable : est-ce que le champ est désactivé ? pas de saisie possible, sélection impossible, contenus non postés. N’est peut être pas valable pour toutes les saisies. (defaut : non, valeurs : null/« non »/autre=oui)
-  disable_avec_post : idem disable, mais en envoyant tout de même le champ en hidden.
-  readonly : est-ce que le champ est non modifiable ? Il n’y a alors pas de saisie possible, sélection possible, contenus postés. N’est peut etre pas valable pour toutes les saisies. (defaut : non, valeurs : null/« non »/autre=oui)
-  saisies_base_conteneur : définit la balise englobante de la saisie (balise div par défaut en SPIP 3.1+, et li avant)
-  conteneur_class : Classe CSS à ajouter au conteneur
-  li_class : pour compatibilité. Voir conteneur_class
-  label_class : classe devant styler le label

Top


Les codes-types de SAISIES proposés


En dehors des saisies autonomes (voir plus bas) les traitements génériques des options (label, explication, les ’attention’ et traitements de obligatoire...affichage d’une erreur associée si il y en a une) sont assurés par une saisies/_base générique...

La saisie par défaut est naturellement :
-  input (voir aussi couleurs et recherche : zone stylisée)

-  textarea
Parametres :
- class : classe(s) css ajoutes au textarea
- rows : nombre de ligne, par defaut : 20
- cols : nombre de caracteres de large, par defaut : 40 (cela depend aussi et surtout du CSS)
- inserer_barre : barre d’outils du porte plume à insérer (forum ou edition par défaut)
- previsualisation : si égale à ’oui’, ajoute l’onglet de prévisualisation
- defaut : valeur par defaut si pas présente dans l’environnement
- valeur_forcee : valeur utilisee meme si une valeur est dans l’environnement

Top

Les choix de cases et boutons


-  case : rend « on » ou «  » (avec label_case à coté de la case )
oui_non renvoie « on » ou «  »

-  checkbox
penser à utiliser la notation tableau pour les éléments de choix (multiple)

-  choisir_objet et
choisir_objets : spécifique SPIP 3 parmi les objets editables formulaires/inc-choisir-objets

  • defaut : peut être une chaine (plusieurs valeurs ou pas) qu’on sait décomposer ]
    #SET{defaut, #ENV{defaut}|saisies_chaine2tableau}
  • valeur : doit être un tableau ! ]
  • exclus : peut être une chaine (plusieurs valeurs ou pas) qu’on sait décomposer

true_false : renvoie true or false sur deux boutons radio
radio sur un seul bouton-radio

Top

Gestion calendaire des dates

date
Zone de saisie de date proposée à l’affichage au format jj/mm/aaaa. utilisant le dateur de Bonux si présent.
Pour tous on utilise class=« date » et class=« heure » pour activer le dateur.

  • La valeur fournie peut être :
    -  au format spip jj/mm/aaaa (date uniquement)
    -  au format SQL aaaa-mm-jj (date uniquement)
    -  au format SQL aaaa-mm-jj hh:mm:ss (date et heure)
    -  un tableau avec une entrée « date » et une entrée « heure » séparée, au format SQL (date et heure obligatoire)
  • Pour utiliser les heures, il faut utiliser l’option « horaire=oui » et class=« heure » pour activer le dateur.

date_jour_mois_annee (Nécessite JS) à partir d’un DATETIME MySQL, par création de trois sous-champs affichés (avant la gestion du champ de saisie)
Options :
-  label_(jour|mois|annee)
-  size_(jour|mois|annee)
-  maxlength_(jour|mois|annee)
-  datetime=oui

La saisie normalisée proposera un champ au format MySQL datetime, sauf si on donne à l’option datetime une autre valeur que oui (il semble qu’il y ait un test "

L’usage de l’option ’normaliser’ de la fonction vérifier permet de rétablir un date au format MySQL

Enfin Rasta signale Yet Another DatePicker : voir une démo avec meme un outil de francisation.... http://freqdec.github.io/datePicker/ à télécharger !

Top


Saisies spécialisées

-  email

pays : pour rechercher automatiquement dans la table spip_GEO_PAYS (utiliser le plugin GeoGraphie)

police choix des polices .TTF trouvées dans le chemin

telephone -mais sans fonction de contrôle actuellement-

position_construire_formulaire

Champs « techniques » de Saisies

-  explication [1]

-  fieldset [2]

-   hidden

Top

Les saisies autonomes

Les saisies qui sont autonomes sont définies par la fonction saisies_autonomes qui appelle le pipeline du même nom qui permet d’en ajouter de nouvelles. Ce sont par défaut les saisies :
-  fieldset
-  hidden
-  destinataires
-  explication

Top


Les Saisies-Vues

articles_originaux auteurs
case
checkbox
date
destinataires
explication
fieldset
groupe_mots
oui_non
radio
secteur
selecteur
selecteur_article
selecteur_article_fonctions.php
selecteur_document
selecteur_langue
selecteur_rubrique
selecteur_rubrique_article
selecteur_site
selection
selection_multiple

Top


Classes utiles

class=inserer_barre_edition
li_class=haut

Top


Autres facilités et découvertes


-  se passer d’un gros message obligatoire :
L’option obligatoire=oui [3] provoque l’affichage d’une ligne complète de texte ;

Ce serait bien agréable de ne juste afficher que l’asterique (en couleur) :

  • le code actuel est maintenant (Saisies 2.2.0) :                        [<label[(#ENV{type_saisie}|match{oui_non|radio|checkbox}|non) for="champ_[(#ENV{id,#ENV{nom}}|saisie_nom2classe)]"]>(#ENV*{label})[<span class='obligatoire'>(#GET{obligatoire}|oui)[(#ENV*{info_obligatoire}|is_null|?{<:info_obligatoire_02:>,#ENV*{info_obligatoire}})]</span>]</label>]

On pouvait rajouter simplement (après la ligne 45 ou 46) de
// saisies/_base.html[45] [<label[(#ENV{type_saisie}|match{oui_non|radio|checkbox}|non) for="champ_#ENV{nom}"]>(#EN l’affichage conditionnel de l’etoile par :
[<span class='obligatoire'>(#GET{obligatoire}|oui)[<a title="(#ENV*{info_obligatoire}|is_null|?{<:info_obligatoire_02:>,#ENV*{info_obligatoire}})">(*)</a>]</span>]

Ce qui vous donnerait :

		<!--!inserer_saisie_editer-->
		<li class="editer editer_[(#ENV{nom}|saisie_nom2classe)][ (#GET{obligatoire})][ (#GET{erreurs}|oui)erreur][ (#GET{li_class})][ (#ENV{li_class})][ saisie_(#ENV{type_saisie})]"[ data-id="(#ENV{id_saisie})"]>
			#ENV*{inserer_debut}
			[<label[(#ENV{type_saisie}|match{oui_non|radio|checkbox}|non) for="champ_#ENV{nom}"]>(#ENV*{label})
   [<span class='obligatoire'>(#GET{obligatoire}|oui)[<a title="(#ENV*{info_obligatoire}|is_null|?{<:info_obligatoire_02:>,#ENV*{info_obligatoire}})">(*)</a>]</span>]
			[<a title="(#ENV*{explication})">?</a>]
				</label>]
			[<span class='erreur_message'>(#GET{erreurs})</span>]
			[<!-- p class='explication'>(#ENV*{explication})</p -->]
			[<em class='attention'>(#ENV*{attention})</em>]
			[(#INCLURE{fond=saisies/#ENV{type_saisie},env,nom=[(#ENV{nom}|saisie_nom2name)], disable=#GET{disable},readonly=#GET{readonly}})]
			[(#ENV{disable_avec_post}|et{#ENV{disable_avec_post}|!={non}}|oui)<input type='hidden' name='[(#ENV{nom}|saisie_nom2name)]' value="#ENV{valeur,#ENV{defaut}}" />]
			#ENV**{inserer_fin}
		</li>

Ensuite, la « bonne » façon de faire serait plutôt d’utiliser les extensions du CSS, en particulier de définir un

form.editer .obligatoire:after {
color: #ff6600; content: "(*)";
font-size: 80%; vertical-align: top;
}

A noter que le plugin saisie intègre nativement une option info_obligatoire pour fournir un libellé à rajouter, donc ici notre (*)..

Mais cela ne vous permettra pas d’avoir la bulle explicative (grâce au <a title=".." >) comme ci-dessus... car la class « obligatoire » est bien appliquée aux labels des champs de formulaire !

Finesses de la syntaxe SPIP

-  Indiquons un problème rencontré avec la syntaxe SPIP :

[(#SAISIE{selection, filiere,
			label=<:offre:label_filiere:>,
                        explication=<:offre:explication_filiere:>,
			datas=[(#ARRAY{administrative,'Admin',technique,'Tech',culturelle,'Culture',sportive,'Sportive',autres,'etc...'})]
				 })]

Ce code ne m’affichait pas de contenu à la sélection : replacer la ligne d’option explications après la définition de datas= m’a réglé le problème...

En effet, dans les arguments d’une balise, il vaut mieux, souvent, ne pas utiliser les crochets et les parenthèses autour d’une autre balise. Ici il aurait fallu faire un #SET avec le #ARRAY, puis un simple #GET dans la #SAISIE.

-  Un autre « bug » que j’ai eu : je ne sais pourquoi, j’avais généré un #SAISIE{input , titre, obligatoire.... L’espace supplémentaire après le type de saisie, et avant la virgule générait un message d’erreur « Aucun squelette Saisies/input .... » et je ne pouvais donc saisir de titre : gênant !!

Top

[1*autonome

[2*autonome

[3A vérifier : Déjà dommage qu’on ne puisse se limiter à saisir juste ’obligatoire’

YannX - Mise à jour :24 novembre 2021 à 12h42min