Un formulaire C.V.T avec Saisies par l’exemple

14 mars 2011 – par stefdn – 22 commentaires

1
2
3
4
5
15 votes

Ceci est une « contribution pédagogique », qui montre par l’exemple comment développer une nouvelle fonctionnalité pour SPIP.

Réalisation d’un formulaire SPIP type CVT avec le plugin Saisies

Pré-requis :

Réalisé avec SPIP 2.1.2 et les plugins suivants :

  • Saisies : Version : 1.8.12 [42956]
  • Bonux : Version : 2.2.14 [42736]
  • Verifier : Version : 0.1.6 [42959]
  • Yaml : Version : 1.4.1 [42112]

Avertissements

Cet article est

  • un « retour d’expérience » sur l’utilisation du plugin Saisies pour la mise en place d’un formulaire ;
  • un partage de réponses aux questions qui se sont posées à moi lors de ma découverte du plugin.

Cet article n’est pas

  • exhaustif : les descriptions qui suivent partent seulement d’un point de vue particulier (un des intérêts de Saisies étant sa pluralité d’approche en terme de développement) ;
  • une documentation développeur.

Le formulaire

Pour cet exemple, le formulaire à réaliser contient 4 champs et 1 fieldset :

  • Fieldset Le film :
    • titre,
    • année,
    • genre
  • Avis : c’est bien ?

Comme tous les formulaires C.V.T, créer un couple de fichiers HTML/PHP dans le dossier squelettes/formulaires :

  • film.html qui accueillera les balises gérées par SPIP et Saisies
  • film.php où sera paramétré le formulaire avec les fonctions C, V et T

Première étape : déclarer ces champs comme des saisies à l’aide d’un tableau PHP [1], dans film.php :

$mes_saisies = array(
  array( // le fieldset 
    'saisie' => 'fieldset',
    'options' => array(
      'nom' => 'le_film',
      'label' => 'Le film'
    ),
    'saisies' => array( // les champs dans le fieldset 
      array( // champ titre : ligne de texte
          'saisie' => 'input',
          'options' => array(
            'nom' => 'titre',
            'label' => 'Son titre',
            'obligatoire' => 'oui'
          )
      ),
      array( // champ annee : 4 chiffres
          'saisie' => 'input',
          'options' => array(
            'nom' => 'annee',
            'label' => 'Année de réalisation',
            'size' => 4,
            'maxlength' => 4
          )
      ),
      array( // champ genre : liste déroulante
        'saisie' => 'selection',
        'options' => array(
          'nom' => 'genre',
          'label' => 'Son genre',
          'datas' => array(  // apparté : penser à ranger les choix par ordre alphabétique (ou numérique), c'est plus facile à trouver pour ceux qui utilisent le formulaire
            'animation' => 'Animation',
            'comedie' => 'Comédie',
            'docu' => 'Documentaire',
            'drame' => 'Drame',
            'sf' => 'Science-fiction'
          )
        )
      ),
    )
  ),
  array( // hors fieldset : avis 
    'saisie' => 'oui_non',
    'options' => array(
      'nom' => 'c_bien',
      'label' => 'C\'est bien ?'
    )
  ),
)
);

Tous les éléments de saisie du formulaire sont définis. Il reste cependant le bouton d’envoi du formulaire (submit) à créer.

Ici (et à l’heure actuelle), deux possibilités :

  1. écrire le bouton en HTML dans film.html :
    <input type="submit" value="envoyer" />
  2. créer son propre type de saisie pour cet élément

Créer son propre type de saisie

Créer un sous-répertoire saisies dans /squelettes, y placer un nouveau fichier qui prendra pour nom le type de la saisie : mon_submit.html et y écrire le code HTML/SPIP du bouton :

[(#REM)   
  Parametres :
  -* nom (obligatoire) : attributs name et id du bouton
  -* texte (optionnel) : attribut value, par défaut Envoyer
  -* class (optionnel) : attribut class, par défaut submit
 
  Exemple d'appel :
	[(#SAISIE{mon_submit, envoyer,
    texte=Ok
	})]
][
<input type="submit" name="(#ENV{nom})" class="#ENV{class, submit}" id="bouton_#ENV{nom}" value="#ENV{texte,Envoyer}" />]

(prendre pour exemple un des fichiers de saisie du plugin dans /plugins/saisies/saisies/)

Ajouter la déclaration du bouton à la fin du tableau $mes_saisies (l’ordre de déclaration définit l’ordre d’affichage) :

array(
  'saisie' => 'mon_submit',
  'options' => array (
    'nom' => 'envoyer',
    'texte' => 'Ok'
  )
)

Générer et Charger le formulaire

Les saisies sont prêtes, on peut les appeler avec #GENERER_SAISIES{#ENV{mes_saisies}} dans film.html

Cette balise ne produit que les éléments contenus dans le formulaire. Il reste donc un peu de travail pour terminer ce formulaire :

[<p class="reponse_formulaire reponse_formulaire_ok">(#ENV**{message_ok})</p>]
[<p class="reponse_formulaire reponse_formulaire_erreur">(#ENV**{message_erreur})</p>]
 
[(#EDITABLE|oui) 
  <form id="film_form" name="film_form" action="#ENV{action}" method="post">
    #ACTION_FORMULAIRE{#ENV{action}}
    <ul>
      #GENERER_SAISIES{#ENV{mes_saisies}}
    </ul>
  </form>]

Maintenant, le formulaire peut être appelé avec la balise #FORMULAIRE_FILM dans un squelette ou avec le raccourci typographique <formulaire|film> à l’intérieur d’un article par exemple.

En prenant ce dernier exemple et en affichant l’article dans la partie publique, rien ne se passe ...c’est normal.

#ENV{mes_saisies} « n’existe pas » encore dans le contexte de la page affichée. Pour ce faire, il faut d’abord mettre en œuvre les fonctions C, V et T qui vont gérer toutes les variables :

  1. Charger les données de Saisies et les champs à manipuler par ces fonctions
  2. Vérifier les valeurs envoyées par le formulaire
  3. Traiter ces données vérifiées
  4. Ainsi qu’une fonction qui permettra d’envoyer à ce trio la structure des saisies (tableau $mes_saisies). Appelons-la mes_saisies_film().
function mes_saisies_film() {
  $mes_saisies = array (
    ...
  );
  return $mes_saisies;
}
 
function formulaires_film_charger_dist() {
// on charge les saisies et les champs qui nécessitent un accès par les fonctions
  $valeurs = array(
    'titre' => '',
    'genre' => '',
    'annee' => '',
    'c_bien' => '',
    'mes_saisies' => mes_saisies_film()
  );
  return $valeurs;
}

En recalculant l’article contenant le formulaire, il doit maintenant s’afficher.

Vérifier les saisies

Le plugin Verifier entre en scène. Saisies utilise un pipeline pour s’y « brancher ». Il est toutefois nécessaire de déclarer dans la structure des saisies les vérifications souhaitées : ajouter un tableau verifier dans le tableau de la saisie à... vérifier.

Ici, le champ annee doit être un nombre (type entier) compris entre 1895 et l’année en cours + 1 (on pourrait anticiper une sortie) :

$mes_saisies = array(
    ...
      array(
        'saisie' => 'input',
        'options' => array(
          'nom' => 'annee',
          'label' => 'Année de réalisation',
          'size' => 4,
          'maxlength' => 4
        ),
        'verifier' => array(
          'type' => 'entier',
          'options' => array (min => 1895, max => (date('Y')+1))
        )
      ),
    ...
  );

Le tableau verifier peut prendre plusieurs options, selon son type
 [2]. Se reporter aux fichiers de vérification du plugin dans /plugins/verifier/verifier/.

Il suffit ensuite de compléter la fonction formulaires_film_verifier dans film.php :

function formulaires_film_verifier_dist() {
 
  // on va chercher le pipeline saisies_verifier() dans son fichier
  include_spip('inc/saisies');
 
  // on charge les saisies
  $mes_saisies = mes_saisies_film();
 
  // saisies_verifier retourne un tableau des erreurs s'il y en a, sinon traiter() prend le relais
  return saisies_verifier($mes_saisies);
}

Traiter le formulaire

La fonction « T » dans film.php est appelée après la fonction « V », si celle-ci ne retourne pas d’erreurs.

function formulaires_film_traiter_dist() {
  // on charge les saisies, si besoin
  $mes_saisies = mes_saisies_film();
 
  // Traitement des données reçues du formulaire, 
  // par mail par ex ou insertion dans une base
    ...
 
  // S'il y a des erreurs, elles sont retournées au formulaire
  return array('message_erreur'=>'Le film n\'a pas été enregistré');
 
  // Sinon, le message de confirmation est envoyé
  return array('message_ok'=>'Le film a été enregistré');
}

Notes

[1] Voir la documentation de Saisies

[2] Les types de vérification fournies par le plugin Verifier :

  • code_postal : code postal français, composé de 5 chiffres
  • date  : date au format JJ/MM/AAAA (avec séparateurs souples : espace / - .)
  • decimal  : un entier cohérent peut être extrait de la valeur
  • email  : validité d’une adresse de courriel
  • entier  : un entier cohérent peut être extrait de la valeur
  • id_document : la valeur correspond à un id_document valide
  • regex  : une valeur suivant une expression régulière.
  • siren_siret : SIREN (9 caractères) ou SIRET (14 caractères)
  • taille  : taille minimale/maximale, pour un mot de passe par exemple
  • telephone  : numéro de téléphone. Pour l’instant seulement avec le schéma français.
  • url  : URL format web

Références des vérifications

Discussion

5 ans 1 an 3 mois Sans limite
Par date
Filtrer

8 discussions

  • 3
    richard

    Bonjour,

    dans votre cours, vous avez créé un formulaire pour saisie de données

    mais après, qu’est-ce qu’on fait des données

    dans article y a pas de place pour ces types de données ?

    merci

    • stefdn

      Salut,

      Le traitement des données n’est pas abordé ici, c’est juste un exemple pour essayer de comprendre comment fonctionnent les « saisies ». Tu peux les enregistrer dans la base, les faire traiter par un plugin (pipeline) ou autre...

      Pour le 2è point, je ne comprends pas la question (o:

    • richard1

      merci,

      je voulais dire : les données titre, année, genre ne sont pas des colonnes de la table articles

      je suppose qu’il faut créer une nouvelle table ...
      là, c’est difficile, j’ai trouvé de la vielle doc (art de marcilla ...) avec une vieille version de spip

      en v3, ca à changé ... si tu connais une bonne doc pour ajouter un champ dans la table articles (exemple no tél) alors merci d’avance

    • stefdn

      C’est tout l’intérêt des Saisies et le plugin Champs Extra devrait répondre à ta problématique

    Répondre à ce message

  • 2
    Orinasa

    Bonjour à vous

    J’ai un soucis avec 2 champs de formulaire, checkbox et selection_multiple
    Voici la réponse à l’enregistrement :
    Warning : md5() expects parameter 1 to be string, array given in /Users/christophevandewalle/Sites/kisetou/ecrire/inc/editer.php on line 355

    Warning : md5() expects parameter 1 to be string, array given in /Users/christophevandewalle/Sites/kisetou/ecrire/inc/editer.php on line 355

    Warning : addslashes() expects parameter 1 to be string, array given in /Users/christophevandewalle/Sites/kisetou/ecrire/req/mysql.php on line 1186

    Warning : Cannot modify header information - headers already sent by (output started at /Users/christophevandewalle/Sites/kisetou/ecrire/inc/editer.php:355) in /Users/christophevandewalle/Sites/kisetou/ecrire/inc/actions.php on line 89

    Quelqu’un aurai une idée ?
    Merci

    Spip 3.0.11
    Saisies 1.35.0
    Yaml 1.5.1

    • Spipmalion

      As-tu trouvé la réponse à ta question ? J’ai le même problème avec selecteur_article et la Fabrique

    • Sylv

      Une question vue ici aussi : La fabrique/forum469283
      J’utilise aussi le selecteur d’article. Dans mon cas, l ’erreur md5 est générée par la fonction vérifier() de CVT.
      La transformation :
      set_request('champ', implode(",", _request('champ')));

      doit donc être appliquée dans la fonction
      formulaires_editer_Nom_de_l_Objet_vérifier()

      avant l’appel à la fonction générique
      formulaires_editer_objet_verifier()

      cause : controler_md5() n’accepte pas de tableau pour la valeur d’un champ, il y a peut-être une autre fonction plus adaptée.

    Répondre à ce message

  • 3
    RéTo

    Bonjour à tous,
    4 jours que moi et mon collègues essayons de faire quelque chose qui conceptuellement est basique mais en vain : afficher dans le .html les résultats d’un formulaire de choix après traitement par le .php associé.

    En clair nous avons créé un formulaire de choix qui, après sélection des critères choisis par l’ utilisateur, va générer la requête SQL à notre banque de données.
    les fonctions charger() et verifier() marchent (tests avec return() et autres messages d’erreurs qui s affichent aux moments attendus). traiter() fonctionne aussi (là aussi vérifié grâce a des return).
    Ce que nous souhaiterions faire c’est retourner sur notre page de formulaire après traitement des données et afficher nos résultats qui sont tous stockés dans un tableau ’resultats’.
    En bref il faudrait que depuis le html, SPIP recupère le tableau ’resultats’, le parcourt et affiche tous ses éléments.
    Nous avons déjà tenté les pistes :
    #ENV (sur le modèle de l’affichage des erreurs dans le formulaire tel que présenté dans le tuto (http://programmer3.spip.net/Gerer-le-retour-d-erreurs)
    #SET et #GET mais on a un peu de mal avec la syntaxe pour que SPIP comprenne où sont les éléments de notre tableau ’resultats’.

    Merci d’avance. Espérons que le problème soit réglé avant le week-end. :))

    Répondre à ce message

  • 3
    rburton

    Bonjour,
    après validation du formulaire et insertion en bdd, comment récupérer dans la page publique l’id de l’enregistrement créé ?

    Merci,
    RB

    • stefdn

      Bonjour,

      Pour l’insertion des valeurs dans la BDD, j’utilise cette fonction : http://doc.spip.org/@sql_insertq
      comme ça :

      $id = sql_insertq($table, $champs_valeurs);
    • rburton

      Bonjour,

      merci, j’avais trouvé ça aussi. Ce que je sais pas c’est comment utiliser cette valeur pour la retourner dans ma page web après validation du formulaire .... j’arrive à retourner message_ok mais pas ça .... ????

      Merci d’avance.
      RB

    • stefdn

      as-tu essayé set_request('champ','valeur') ?

      à définir avant le retour de Traiter, avec :

      • champ = un champ qui va recevoir ton ID (doit être déclaré dans Charger)
      • valeur = l’ID retourné par sql_insertq

    Répondre à ce message

  • 2
    Matthieu Marcillaud

    Autre chose, sachant que tu peux passer une valeur par défaut dans une saisie, tu pourrais lister tous les champs à utiliser et leurs valeurs par défaut également dans le charger(). Je me demande si Rastapopoulos a fait une fonction pour cela dans saisies.

    • RastaPopoulos

      Il y a déjà une fonction pour ça dans Saisies. :)

      Mais surtout je rappelle que depuis la version 1.9 Saisies permets même de faire un CVT sans ni la fonction charger() ni la fonction verifier() !

      Uniquement en déclarant une fonction « formulaires_montruc_saisies() » cf la doc et l’exemple.

    • Yffic

      Pour compléter le message de Rastapopoulos et pour ceux qui cherchent, la doc, c’est par là pour l’instant : http://www.spip-contrib.net/Doc-Saisies-complementaire

    Répondre à ce message

  • 1
    Joseph

    On peut encore améliorer les choses pour la partie charger du formulaire. En effet, saisies fournit une fonction saisies_charger_champs(). Dès lors, la fonction charger peut devenir :

    function mes_saisies_film() {
  $mes_saisies = array (
    ...
  );
  return $mes_saisies;
}
function formulaires_film_charger_dist() {
// on charge les saisies et les champs
  include_spip('inc/saisies');
  $mes_saisies = mes_saisies_film();
  $contexte = saisies_charger_champs($mes_saisies);
  $contexte['mes_saisies'] = $mes_saisies;
  return $contexte;
}
    • RastaPopoulos

      Nan nan :

      function formulaires_film_saisies_dist(){
	return array(
		// le tableau de saisies
	);
}

      Ça c’est LA bonne méthode propre depuis la 1.9.0. :)

      À tester/améliorer si besoin, mais normalement ça fait tout charger() et tout verfier() tout seul. En tout cas les besoins de base. Et à documenter ensuite... :)

    Répondre à ce message

  • charles

    Salut et merci pour cette note.

    Je suis super embêter j’ai fait un peu la même chose mais je n’arrive pas à insérer en bdd.
    Tout est bon sauf ma fonction _traiter, pourriez vous m’aider ? Auriez vous une idée ?

    function formulaires_voter_traiter_dist($id_article,$id_auteur) {
 
	$matable = array(`id_vote`, `id_article`, `id_auteur`, `real`, `image`, `jeu`, `scenar`, `amour`, `total`, `commentaire`, `date`);
	$where = array('id_article = '.$id_article ,'id_auteur = '.$id_auteur);
 
	$real = _request('real');
	$image = _request('image');
	$jeu = _request('jeu');
	$scenar = _request('scenar');
	$amour = _request('amour');
	$commentaire = _request('commentaire');
	$total = $real + $image + $jeu + $scenar + $amour;
 
 
	if (!sql_countsel("spip_votes_films", $where)) {
			$res = sql_select('id_vote','spip_votes_films');
			$id_vote = sql_countsel('spip_votes_films') +1;
			$champs = array(
				'id_vote'=>$id_vote,
				'id_article'=>$id_article,
				'id_auteur'=>$id_auteur,
				'real'=>$real,
				'image'=>$image,
				'jeu'=>$jeu,
				'scenar'=>$scenar,
				'amour'=>$amour,
				'total'=>$total,
				'commentaire'=>sql_quote($commentaire),
				'date'=> date('Y-m-d H:i:s')
			);
			sql_insertq("spip_votes_films",$champs);		
		} else {
			$id_vote = sql_select($matable,'spip_votes_films', $where);
			$champs = array(
				'id_vote'=>$id_vote,
				'id_article'=>$id_article,
				'id_auteur'=>$id_auteur,
				'real'=>$real,
				'image'=>$image,
				'jeu'=>$jeu,
				'scenar'=>$scenar,
				'amour'=>$amour,
				'total'=>$total,
				'commentaire'=>sql_quote($commentaire),
				'date'=> date('Y-m-d H:i:s')
			);
 
			sql_updateq('spip_votes_films',$champs,$where);
	}
 
 
//	return array('message_ok'=>'Votre message a bien été pris en compte. Vous recevrez prochainement une réponse !');

    Répondre à ce message

  • Matthieu Marcillaud

    Sympa. D’autant plus que je ne connaissais pas saisies_verifier($mes_saisies);

    Je pense par contre qu’il vaudrait mieux passer dans charger() « _saisies » ou « _mes_saisies » plutôt que « saisies » ou « mes_saisies » : le souligné en premier indique à SPIP de ne pas effectuer de traitements automatiques sur les données (http://programmer.spip.org/Charger-les-valeurs-du-formulaire).

    Répondre à ce message

Ajouter un commentaire

Qui êtes-vous ?

Pour afficher votre trombine avec votre message, enregistrez-la d’abord sur gravatar.com (gratuit et indolore) et n’oubliez pas d’indiquer votre adresse e-mail ici.

Ajoutez votre commentaire ici

Ce champ accepte les raccourcis SPIP {{gras}} {italique} -*liste [texte->url] <quote> <code> et le code HTML <q> <del> <ins>. Pour créer des paragraphes, laissez simplement des lignes vides.

Ajouter un document

Suivre les commentaires : RSS 2.0 | Atom

Dernière modification de cette page le 8 septembre 2011