Formulaire en plusieurs étapes

Version imprimable

11/01/2017, 10h44
PolkovnikMedved

Formulaire en plusieurs étapes
Bonjour,

J'ai une inscription à faire et pour cela je dois faire intervenir une dizaine d'entités Doctrine....

C'est pour cela que j'aimerais faire un formulaire en plusieurs étapes mais j'ai cherché un moyen de faire ça et je suis un peu perdu.

J'aimerais bien faire un formulaire dans lequel je peux avoir au moins deux boutons : suivant et enregistrer et quitter. (un bouton précédent fonctionnel en plus serait le top !)

J'ai déjà rencontré ce genre de formulaires en Python (Framework Pyramid) mais je vous avoue que je ne comprenais pas le fonctionnement et en plus il y avait pas mal d'AJAX (et je n'ai jamais trop pratiqué le AJAX)

Les possibilités que j'ai trouvé sont :

1) CraueFormBundle
Ne fonctionne pas dans mon cas car si je comprends bien CraueFormBundle permet d'hydrater un seul objet à l'aide de plusieurs formulaires qui en forment les étapes. Moi j'ai plusieurs Entités à hydrater....

2) Plugin jQuery qui met un formulaire sur plusieurs étapes. (FormToWizard)
En fait, je pourrais utiliser ce si chaque formulaire était lié (par exemple dans le formulaire Client on appelle le formulaire commande dans lequel on appelle le formulaire etc ) ce qui n'est pas mon cas ...

3) Chaque formulaire passe par un if (isSubmitted() && isValid()) et est sauvegardé dans une variable Session jusqu'à la dernière étape à laquelle on sauvegarde le tout.

4) Custom
Ce à quoi j'ai pensé c'est d'afficher mes formulaires très simplement :
A) une route telle que :
Code:

1 2 3 4 mon_bundle_steps: path: inscription/{step} defaults: { _controller: MonBundle:MonController:index }
B) un controller qui aurait une fonction indexAction($step) qui va déterminer l'étape à laquelle on s'est arrêté précédemment et qui renvoie à l'action correspondante par ex: step3Action(){}

C) Chaque action (tq step[entier]Action) instancie un objet, crée le formulaire pour cet objet affiche le formulaire et enregistre (ou met en session) avant de rediriger à l'étape suivante.

Après le problème c'est d'avoir les boutons save&quit et next fonctionnels et que on ne puisse pas foutre la pagaille en modifiant le step dans la barre d'url....

Je voudrais vous demander si quelqu'un à déjà rencontré la problématique et qui pourrait m'aiguiller dans cette tâche.

Merci.

j'ai lu en croisé et je crois que tu cherches les complications alors que c'est simple.
en gros, je ferai comme ça :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
* une action du controlleur :
'\inscription\etape-1', 'inscription_etape_1'
InscriptionEtape1Action()   
   entité user  -> chargé en base si il existe
   etape1FormType(user
   isValid() 
       ...  enregistrement en base
       ->  inscription_etape_2
   sinon      ->  inscription_etape_1
 
* la vue :
   etape1FormType ...
   boutton inscription et suivant    ->  inscription_etape_1

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
 
* une action du controlleur :
'\inscription\etape-2', 'inscription_etape_2'
InscriptionEtape2Action()
   entité compte -> chargé en base si existe
   etape2FormType(compte
   isValid() 
       ...  enregistrement en base
       ->  fin
   sinon  ->  inscription_etape_2    
 
* la vue :
   etape2FormType ...
   boutton terminé       ->  inscription_etape_2 
   boutton precedent     ->  inscription_etape_1

11/01/2017, 11h49
PolkovnikMedved

En soi tu as raison.

Je fais finir mes étapes de cette manière la après je vais voir pour les fonctionnalités en plus.

Merci :p
11/01/2017, 13h42
Nico_F

L'inconvénient de la méthode proposée par dukoid c'est que si tu persistes tes data en base à chaque étape, tu peux potentiellement te retrouver avec des data incomplètes si l'utilisateur ne va pas jusqu'au bout.

La dizaine d'entités doctrine impliquées par ton inscription ne devrait pas influencer la manière dont tu gères ton formulaire.
Je te suggère la solution CraueFormBundle sachant qu'il est possible de baser l'ensemble de ton formulaire (sous entendu toutes les étapes) sur une classe unique : il suffirait d'utiliser une classe FormModel.

Les données de ton User seront alors stockées dans un attribut $user, les données du compte stockées dans un attribut $compte etc.

C'est seulement une fois la dernière étape validée que tu vas reconstituer ton graphe d'objet à partir de l'ensemble des valeurs se trouvant dans ton FormModel, et à ce moment que tu vas faire un unique persist en BDD.

Pour la validation tu as le choix, soit de déclarer des contraintes au niveau du FormType, soit d'utiliser les Assert au niveau du FormModel.
11/01/2017, 16h08
dukoid

Nico_f à tout à fait raison si il s'agit de plusieurs étapes et toutes aussi importantes les unes que les autres..

comme j'ai cru comprendre qu'il n'y a que 2 étapes ,je ne pense pas qu'il faille utiliser un bundle pour ça. je suis un adepte de la simplicité et contre toute utilisation de surplus de bundle mais bon je me trompe peut être :mouarf:

de plus je pense Web, l'internaute ça le saoule de suivre 50 étapes pour pouvoir s'inscrire hors avec user, mail, password, il est déjà inscrit. quitte à demander plus tard de compléter.....
on ne connait pas vraiment le cahier des charges et le contexte du projet ......

on peut faire en sorte qu'à la fin de l'etape 1, le compte user n'est pas activé.
il le sera une fois la dernière étape fait !
11/01/2017, 16h46
PolkovnikMedved

Citation:

Envoyé par Nico_F

L'inconvénient de la méthode proposée par dukoid c'est que si tu persistes tes data en base à chaque étape, tu peux potentiellement te retrouver avec des data incomplètes si l'utilisateur ne va pas jusqu'au bout.

La dizaine d'entités doctrine impliquées par ton inscription ne devrait pas influencer la manière dont tu gères ton formulaire.
Je te suggère la solution CraueFormBundle sachant qu'il est possible de baser l'ensemble de ton formulaire (sous entendu toutes les étapes) sur une classe unique : il suffirait d'utiliser une classe FormModel.

Les données de ton User seront alors stockées dans un attribut $user, les données du compte stockées dans un attribut $compte etc.

C'est seulement une fois la dernière étape validée que tu vas reconstituer ton graphe d'objet à partir de l'ensemble des valeurs se trouvant dans ton FormModel, et à ce moment que tu vas faire un unique persist en BDD.

Pour la validation tu as le choix, soit de déclarer des contraintes au niveau du FormType, soit d'utiliser les Assert au niveau du FormModel.

Merci pour ta réponse,

Juste une petite question ... Comme Doctrine sauvegarde tout ça dans ma bd ? Il faut un genre de cascade={"persist"} dans la classe FormModel ?
Puisque si j'ai un attribut $child; qui est une instance Person comment je fais pour que ce soit enregistré dans la BD ?

Et la réponse à toutes vos questions : j'ai mis User-Commande pour l'exemple. En réalité je dois inscrire un enfant à une crèche ce qui implique 6 étapes :
1) Définition de l'enfant et choix de la crèche.
2) Définition du dossier médical de l'enfant, du cabinet médical qui à rédigé le dossier et son addresse
3) On définit la famille de l'enfant
4) On définit les contacts pour la crèche avec leur ordre de priorité
5) Download des documents d'inscription par le responsable de l'enfant et confirmation
6) Upload des documents d'inscription signés.

j'ai justement voulu organiser ça en étapes sinon on aurait un seul formulaire de 3KM et l'utilisateur va laisser tomber après 15min.

C'est pour cela aussi que j'aimerais bien sauvegarder l'étape à laquelle l'utilisateur est si il décide de finir l'inscription plus tard.

Merci pour vos réponses.
11/01/2017, 17h28
MehrezLabidi

en réponse a ta petite question juste à la fin .
Pour créer des données dans la base tu crée des objets comme d'habitude et tu crée tes formulaire FormType comme d'habitude , sauf que le data_class de la formType correpond au model ;) pas à une classe entité
11/01/2017, 17h43
PolkovnikMedved

Citation:

Envoyé par MehrezLabidi

en réponse a ta petite question juste à la fin .
Pour créer des données dans la base tu crée des objets comme d'habitude et tu crée tes formulaire FormType comme d'habitude , sauf que le data_class de la formType correpond au model ;) pas à une classe entité

Merci beaucoup ! Je vais tester ça demain et je vous tiens tous au courant :D
12/01/2017, 15h22
Nico_F

Citation:

Envoyé par PolkovnikMedved

Juste une petite question ... Comme Doctrine sauvegarde tout ça dans ma bd ? Il faut un genre de cascade={"persist"} dans la classe FormModel ?
Puisque si j'ai un attribut $child; qui est une instance Person comment je fais pour que ce soit enregistré dans la BD ?

Non, pas d'annotation Doctrine dans le FormModel : le FormModel ne sert qu'à contenir les valeurs et éventuellement la validation si tu décides de mettre des annotations Assert dessus.
Pour l'enregistrement en base l'idée est de récupérer toutes ces données (dont aucune n'est persistée) depuis cette classe FormModel et de faire ton persist sur les entités qu'elle contient à la fin.

Citation:

Envoyé par Nico_F

L'inconvénient de la méthode proposée par dukoid c'est que si tu persistes tes data en base à chaque étape, tu peux potentiellement te retrouver avec des data incomplètes si l'utilisateur ne va pas jusqu'au bout.

La dizaine d'entités doctrine impliquées par ton inscription ne devrait pas influencer la manière dont tu gères ton formulaire.
Je te suggère la solution CraueFormBundle sachant qu'il est possible de baser l'ensemble de ton formulaire (sous entendu toutes les étapes) sur une classe unique : il suffirait d'utiliser une classe FormModel.

Les données de ton User seront alors stockées dans un attribut $user, les données du compte stockées dans un attribut $compte etc.

C'est seulement une fois la dernière étape validée que tu vas reconstituer ton graphe d'objet à partir de l'ensemble des valeurs se trouvant dans ton FormModel, et à ce moment que tu vas faire un unique persist en BDD.

Pour la validation tu as le choix, soit de déclarer des contraintes au niveau du FormType, soit d'utiliser les Assert au niveau du FormModel.

Bonjour !

Alors j'ai essayé le CraueFormFlow ... Ca a très bien marché pour un flow, ensuite j'ai fait un deuxième et je n'ai même pas eu l'occasion de le voir que j'ai une erreur 500 à tous les deux. Tout mon site fonctionne sauf mes deux flow. J'ai rien dans les logs Symfony et dans les logs Apache j'ai juste la route et le code 500.... J'ai vraiment l'impression que ce CraueFormBundle est très instable (d'ailleurs je l'avais essayé avant et quand j'ai deploy mon site j'avais une page blanche. Après avoir réglé le cache, les droits sur les dossiers il m'est apparu une erreur sur le serveur qui parlait d'un STDIN qui fonctionnait pas en bref, en enlevant le craueformbundle tout fonctionnait)

Au cas où voici mon code :
Ma classe de base :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
<?php
 
namespace VS\CrmBundle\Wizard;
 
use Doctrine\Common\Collections\ArrayCollection;
use VS\CrmBundle\Entity\MedicalRecord;
use VS\CrmBundle\Entity\Person;
use VS\CrmBundle\Entity\Relationship;
 
class AddChildWizard
{
    /**
     * Step 1
     *
     * @var Relationship
     */
    private $currenUserChildRelationship;
 
    /**
     * Step 1
     *
     * @var Person
     */
    private $child;
 
    /**
     * Step 2
     *
     * @var MedicalRecord
     */
    private $childsMedicalRecord;
 
    /**
     * Step 3
     *
     * This is a collection of Relationship entities
     *
     * @var ArrayCollection
     */
    private $childsFamily;
 
    public function __construct()
    {
        $this->childsFamily = new ArrayCollection();
    }
 
    /**
     * @return Relationship
     */
    public function getCurrenUserChildRelationship()
    {
        return $this->currenUserChildRelationship;
    }
 
    /**
     * @param Relationship $currenUserChildRelationship
     */
    public function setCurrenUserChildRelationship($currenUserChildRelationship)
    {
        $this->currenUserChildRelationship = $currenUserChildRelationship;
    }
 
    /**
     * @return Person
     */
    public function getChild()
    {
        return $this->child;
    }
 
    /**
     * @param Person $child
     */
    public function setChild($child)
    {
        $this->child = $child;
    }
 
    /**
     * @return MedicalRecord
     */
    public function getChildsMedicalRecord()
    {
        return $this->childsMedicalRecord;
    }
 
    /**
     * @param MedicalRecord $childsMedicalRecord
     */
    public function setChildsMedicalRecord($childsMedicalRecord)
    {
        $this->childsMedicalRecord = $childsMedicalRecord;
    }
 
    /**
     * @return ArrayCollection
     */
    public function getChildsFamily()
    {
        return $this->childsFamily;
    }
 
    /**
     * @param ArrayCollection $childsFamily
     */
    public function setChildsFamily($childsFamily)
    {
        $this->childsFamily = $childsFamily;
    }
 
}

Ma classe de flow :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
<?php
 
namespace VS\CrmBundle\Form\Wizard\AddChild;
 
use Craue\FormFlowBundle\Form\FormFlow;
use Craue\FormFlowBundle\Form\FormFlowInterface;
 
 
class AddChildFlow extends FormFlow {
    protected function loadStepsConfig()
    {
        return array(
            array(
                'label' => 'ChildData',
                'form_type' => 'VS\CrmBundle\Form\Wizard\AddChild\AddChildStep1'
            ),
            array(
                'label' => 'ChildMedicalRecord',
                'form_type' => 'VS\CrmBundle\Form\Wizard\AddChild\AddChildStep2'
            ),
            array(
                'label' => 'ChildFamily',
                'form_type' => 'VS\CrmBundle\Form\Wizard\AddChild\AddChildStep3'
            ),
            array(
                'label' => 'confirmation',
            ),
        );
    }
}

Mes formulaires d'étapes :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<?php
 
namespace VS\CrmBundle\Form\Wizard\AddChild;
 
use Symfony\Component\Form\AbstractType;
use Symfony\Component\Form\FormBuilderInterface;
use VS\CrmBundle\Entity\Person;
use VS\CrmBundle\Entity\Relationship;
use VS\CrmBundle\Form\PersonChildType;
use VS\CrmBundle\Form\RelationshipFromCurrentUserType;
 
class AddChildStep1 extends AbstractType {
    public function buildForm(FormBuilderInterface $builder, array $options)
    {
        $builder
            ->add('currenUserChildRelationship', RelationshipFromCurrentUserType::class, array(
                'data_class' => Relationship::class
            ))
            ->add('child', PersonChildType::class, array(
                'data_class' => Person::class
            ));
    }
 
    public function getBlockPrefix()
    {
        return 'AddChildStep1';
    }
}

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<?php
 
namespace VS\CrmBundle\Form\Wizard\AddChild;
 
use Symfony\Component\Form\AbstractType;
use Symfony\Component\Form\FormBuilderInterface;
use VS\CrmBundle\Entity\MedicalRecord;
use VS\CrmBundle\Form\MedicalRecordType;
 
class AddChildStep2 extends AbstractType {
    public function buildForm(FormBuilderInterface $builder, array $options)
    {
        $builder->add('childsMedicalRecord', MedicalRecordType::class, array(
            'data_class' => MedicalRecord::class
        ));
    }
 
    public function getBlockPrefix()
    {
        return 'AddChildStep2';
    }
}

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<?php
 
namespace VS\CrmBundle\Form\Wizard\AddChild;
 
use Symfony\Component\Form\AbstractType;
use Symfony\Component\Form\Extension\Core\Type\CollectionType;
use Symfony\Component\Form\FormBuilderInterface;
use VS\CrmBundle\Form\RelationshipType;
 
class AddChildStep3 extends AbstractType {
    public function buildForm(FormBuilderInterface $builder, array $options)
    {
        $builder->add('childsFamily', CollectionType::class, array(
            'entry_type' => RelationshipType::class,
            'allow_add' => true
        ));
    }
 
    public function getBlockPrefix()
    {
        return 'AddChildStep2';
    }
}

la declaration du service :

Code:

1
2
3
    vs_crm.form.flow.add_child:
        class: VS\CrmBundle\Form\Wizard\AddChild\AddChildFlow
        parent: craue.form.flow

et l'action dans le controlleur :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
public function addChildAction()
    {
        // Our form data class
        $formData = new AddChildWizard();
 
        // We call service (craue form flow)
        $flow = $this->get('vs_crm.form.flow.add_child');
        $flow->bind($formData);
 
        $form = $flow->createForm();
        if($flow->isValid($form))
        {
            $flow->saveCurrentStepData($form);
 
            if($flow->nextStep())
            {
                $form = $flow->createForm();
            }
            else
            {
                /*
                    // flow finished
                    $em = $this->getDoctrine()->getManager();
                    $em->persist($formData);
                    $em->flush();
 
                 */
 
                //$flow->reset();
                //return $this->redirect();
                return new JsonResponse(array('PERSIST AND FLUSH BRO'));
            }
        }
 
        return $this->render('VSCrmBundle:Parent:add-child.html.twig', array(
            'form' => $form->createView(),
            'flow' => $flow
        ));
    }