[2.x] [Form] Formulaire imbriqué

bonjour je suis entrain de faire un formulaire imbriqué j'ai en faite une page qui contient un ensemble de groupes

voila mon Pages.php

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
112
113
114
115
116
117
118
119
120
121
122
<?php
 
namespace MyApp\GenerateurBundle\Entity;
 
use Doctrine\ORM\Mapping as ORM;
 
/**
 * Pages
 *
 * @ORM\Table(name="pages")
 * @ORM\Entity
 */
class Pages
{
 
    function __construct() {
         $this->listGroups = new \Doctrine\Common\Collections\ArrayCollection();
    }
 
    /**
     * @var integer
     *
     * @ORM\Column(name="id", type="integer", nullable=false)
     * @ORM\Id
     * @ORM\GeneratedValue(strategy="IDENTITY")
     */
    private $id;
 
    /**
     * @var integer
     *
     * @ORM\Column(name="number_page", type="integer", nullable=true)
     */
    private $numberPage;
 
    /**
     * @var \DateTime
     *
     * @ORM\Column(name="modified", type="datetime", nullable=true)
     */
    private $modified;
 
    /**
     * @var \DateTime
     *
     * @ORM\Column(name="created", type="datetime", nullable=true)
     */
    private $created;
 
    /**
     * @var \Surveys
     *
     * @ORM\ManyToOne(targetEntity="Surveys")
     * @ORM\JoinColumns({
     *   @ORM\JoinColumn(name="surveys", referencedColumnName="id")
     * })
     */
    private $surveys;
 
    /**
     * @var \Groups
     *
     * @ORM\OneToMany(targetEntity="Groups", mappedBy="pages",cascade="persist")
     */
 
    private $listGroups;
    public function getListGroups() {
        return $this->listGroups;
    }
 
    public function setListGroups(Groups $listGroups) {
        foreach ($listGroups as $groups) {
        $groups->addPages($this);}
 
        $this->listGroups = $listGroups;
    }
 
        public function getId() {
        return $this->id;
    }
 
    public function setId($id) {
        $this->id = $id;
    }
 
    public function getNumberPage() {
        return $this->numberPage;
    }
 
    public function setNumberPage($numberPage) {
        $this->numberPage = $numberPage;
    }
 
    public function getModified() {
        return $this->modified;
    }
 
    public function setModified(DateTime $modified) {
        $this->modified = $modified;
    }
 
    public function getCreated() {
        return $this->created;
    }
 
    public function setCreated(DateTime $created) {
        $this->created = $created;
    }
 
    public function getSurveys() {
        return $this->surveys;
    }
 
    public function setSurveys(Surveys $surveys) {
        $this->surveys = $surveys;
    }
    public function __toString() {
        return "$this->numberPage";
    }
 
 
}

mon twig:

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
{% extends '::base.html.twig' %}
{% block body %}
<script src="http://code.jquery.com/jquery-1.6.2.min.js"></script>
 
<form action="{{ path('pages_create') }}" method="POST" {{ form_enctype(form) }}>
 
    <a href="#" Onclik=function(e)>Ajouter un groupe</a>
 
 
    {{ form_widget(form) }}
 
 
    <ul  class="groups" data-prototype="{{ form_widget(form.listgroups.vars.prototype.name)|e }}" >
 
        {% for group in form.listgroups%}
        <li>{{ form_row(group.name) }}</li>
 
 
        <ul  class="questions" data-prototype="{{ form_widget(group.listQuestions.vars.prototype)|e }}" >
                     {% for question in group.listQuestions%}
                <li>{{ form_widget(question.text) }}</li>
        {% endfor %}
                  {% endfor %}
                </ul>
            </ul>
 
 
        </form>
        <ul>
 
            <input type="submit" value="create">
        </ul>
 
        <script type="text/javascript">
            var collectionHolder = $('ul.group');
 
            // ajoute un lien « add a group »
            var $addGroupLink = $('<a href="#" class="add_group_link">Ajouter un groupe</a>');
            var $newLinkLi = $('<li></li>').append($addGroupLink);
 
            jQuery(document).ready(function() {
                // ajoute l'ancre « ajouter un group » et li à la balise ul
                collectionHolder.append($newLinkLi);
 
                $addgroupLink.on('click', function(e) {
                    // empêche le lien de créer un « # » dans l'URL
                    e.preventDefault();
 
                    //ajoute un nouveau formulaire group (voir le prochain bloc de code)
                    addgroupForm(collectionHolder, $newLinkLi);
                });
            });
            function addGroupForm(collectionHolder, $newLinkLi) {
                // Récupère l'élément ayant l'attribut data-prototype comme expliqué plus tôt
                var prototype = collectionHolder.attr('data-prototype');
 
                // Remplace '__name__' dans le HTML du prototype par un nombre basé sur
                // la longueur de la collection courante
                var newForm = prototype.replace(/__name__/g, collectionHolder.children().length);
 
                // Affiche le formulaire dans la page dans un li, avant le lien "ajouter un group"
                var $newFormLi = $('<li></li>').append(newForm);
                $newLinkLi.before($newFormLi);
            }
 
            </script>
 
 
{% endblock %}

mais si je clique sur le lien Ajouter un groupe j'ai aucune action qui se produit sauf que j'ai un # ajouté à la fin de mon url!!

merci de m'aider à résoudre ce problème