Version 18 — Avril 2015 — YannX
Le plugin SAISIE propose de nombreuses facilités pour organiser les formulaires : récapitulons le contenu de ce ./saisies/saisies/
.
Voir aussi :
- Saisies : Doc complémentaire.
- Plugin vérifier
Attention, cette page présente actuellement des notes simples, non encore complètement testées.. Je reviendrais les compléter peu à peu ; mais vous pouvez aussi les compléter, et mieux, les corriger !!
Pour commencer, un « bug » [1]rencontré sur une
[(#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...
(Y’aurait-il un souci à l’interprétation de .'})] })]
? )
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...
Ces saisies peuvent être améliorées par l’usage de nombreuses options, et par l’utilisation intégrant des options de Verifier
, avec
verifier=[(#ARRAY{
#ARRAY{type,entier},
#ARRAY{option, #ARRAY{
}
})]
(à controler/préciser)
- 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
#SET{defaut, #ENV{defaut}|saisies_chaine2tableau}
true_false : renvoie true or false sur deux boutons radio
radio sur un seul bouton-radio
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.
date_jour_mois_année (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 !
- explication [2]
- fieldset [3]
- hidden
- input (voir aussi couleurs et recherche : zone stylisée)
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
Ces modes utilisent SPIP Bonux et les ./formulaires/selecteurs/...
- secteur : rend in #ID_SECTEUR
Parametres :
- class : classe(s) css ajoutes au select
- multiple : si quelquechose est passe, le select est multiple, sinon, c’est un select simple
Dans le cas multiple, defaut et valeur doivent etre un array, sinon un int
- recursif : si oui liste les rubriques de facon recursive, et pas uniquement les secteurs
- option_intro : chaine de langue de la premiere ligne vide ? (defaut : »")
(seulement si non multiple)
- cacher_option_intro : pas de premier option vide (defaut :« »)
- defaut : valeur par defaut si pas présente dans l’environnement
- valeur_forcee : valeur utilisee meme si une valeur est dans l’environnement
selecteur (générique : pour SPIP3 uniquement)
selecteur_article
selecteur_rubrique
selecteur_rubrique_article
rendent un tableau : objet=>id
selecteur_document
selecteur_langue
selecteur_site
- selection
selection_multiple
selection_par_groupe
Parametres :
-* ** datas : tableau de donnees
liste simple : cle=>valeur
liste avec groupes : cle=> tableau (cle=>valeur)
-* option_intro : chaine de langue de la premiere ligne vide ? (defaut :« »)
-* cacher_option_intro : pas de premier option vide (defaut :« »)
-* class : classe(s) css ajoutes au select
-* defaut : valeur par defaut si pas présente dans l’environnement
-* valeur_forcee : valeur utilisee meme si une valeur est dans l’environnement
groupe_mots
mot
Parametres :
- class : classe(s) css ajoutes au select
- option_intro : chaine de langue de la premiere ligne vide ? (defaut :« »)
- cacher_option_intro : pas de premier option vide (defaut :« »)
- id_groupe : groupe des mots clés à afficher
- defaut : valeur par defaut si pas présente dans l’environnement
- valeur_forcee : valeur utilisee meme si une valeur est dans l’environnement
articles_originaux
auteurs
destinataires
statuts_auteurs
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
url
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
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
class=inserer_barre_edition
li_class=haut
- se passer d’un gros message obligatoire :
L’option obligatoire=oui [4]provoque l’affichage d’une ligne complète de texte ;
Ce serait bien agréable de ne juste afficher que l’asterique (en couleur) :
[<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;
}
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 !