gistfile1.txt

// Mon entité Image

class Image
{
    /**
     * @var int
     */
    private $id;

    /**
     * @var string
     */
    private $alt;

    /**
     * @var UploadedFile
     */
    private $url;

    /**
     * @var
     */
    private $tricks; //tableau d' objet tricks




    public function __construct()
    {
        //$this->tricks = new ArrayCollection();
    }



    /**
     * @return int
     */
    public function getId():? int
    {
        return $this->id;
    }

    /**
     * @return string
     */
    public function getAlt():? string
    {
        return $this->alt;
    }

    /**
     * @param string $alt
     */
    public function setAlt(string $alt)
    {
        $this->alt = $alt;
    }

    /**
     * @return UploadedFile
     */
    public function getUrl()
    {
        return $this->url;
    }

    /**
     * @param UploadedFile $url
     */
    public function setUrl($url)
    {
        $this->url = $url;
    }

    /**
     * @return mixed
     */
    public function getTricks()
    {
        return $this->tricks;
    }

    /**
     * @param mixed $tricks
     */
    public function setTricks($tricks)
    {
        $this->tricks = $tricks;
    }
}

// Mon entite Tricks

class Tricks
{
    /**
     * @var int
     */
    private $id;

    /**
     * @var string
     */
    private $nom;

    /**
     * @var string
     */
    private $description;

    /**
     * @var \DateTime
     */
    private $dateCreation;

    /**
     * @var \DateTime
     */
    private $dateModification;

    /**
     * @var Utilisateur
     */
    private $utilisateur;

    /**
     * @var Commentaire
     */
    private $commentaire;

    /**
     * @var ArrayCollection
     */
    private $groupe; // tableau d'objet groupe

    /**
     * @var UploadedFile
     */
    private $image; // tableau d'objet image

    /**
     * @var ArrayCollection
     */
    private $video; // tableau d'objet video


    public function __construct()
    {
        $this->groupe = new ArrayCollection();
        //$this->image = new ArrayCollection();
        $this->video = new ArrayCollection();
        $this->dateCreation = new \DateTime();
    }

    

    /**
     * @return UploadedFile
    */
    public function getImage()
    {
        return $this->image;
    }

    /**
     * @param UploadedFile $image
    */
    public function setImage($image)
    {
        $this->image = $image;
    }





    /**
     * @return ArrayCollection
     */
    public function getVideo()
    {
        return $this->video;
    }

    /**
     * @param Video $video
     */
    public function addVideo(Video $video)
    {
        $this->video[] = $video;
    }

    /**
     * @param ArrayCollection $video
     */
    public function setVideo(ArrayCollection $video)
    {
        $this->video = $video;
    }
}


// Ma vue

<div class="form-group">

                    {{ form_start(form) }}

{#
                    {{ form_row(form.nom) }}
                    {{ form_row(form.description) }}
                    {{ form_row(form.groupe) }}
                    {{ form_row(form.image) }}
#}



                    <!-- Jquery pour l' ajout d 'image -->

                    {# Bouton pour l' ajout d image #}
                    <ul class="image" data-prototype="{{ form_widget(form.image.vars.prototype)|e('html_attr') }}">

                    </ul>


                    <script>

                        var $collectionHolder;

                        // setup an "add a image" link
                        var $addImageLink = $('<a href="#" class="add_image_link">Ajouter une image</a>');
                        var $newLinkLi = $('<li></li>').append($addImageLink);

                        jQuery(document).ready(function() {
                            // Get the ul that holds the collection of image
                            $collectionHolder = $('ul.image');

                            // add a delete link to all of the existing tag form li elements
                            $collectionHolder.find('li').each(function() {
                                addImageFormDeleteLink($(this));
                            });

                            // add the "add a image" anchor and li to the image ul
                            $collectionHolder.append($newLinkLi);


                            // count the current form inputs we have (e.g. 2), use that as the new
                            // index when inserting a new item (e.g. 2)
                            $collectionHolder.data('index', $collectionHolder.find(':input').length);

                            $addImageLink.on('click', function(e) {
                                // prevent the link from creating a "#" on the URL
                                e.preventDefault();

                                // add a new tag form (see next code block)
                                ImageAddType($collectionHolder, $newLinkLi);
                            });
                        });

                        function ImageAddType($collectionHolder, $newLinkLi) {
                            // Get the data-prototype explained earlier
                            var prototype = $collectionHolder.data('prototype');

                            // get the new index
                            var index = $collectionHolder.data('index');

                            var newForm = prototype;
                            // You need this only if you didn't set 'label' => false in your tags field in TaskType
                            // Replace '__name__label__' in the prototype's HTML to
                            // instead be a number based on how many items we have
                            // newForm = newForm.replace(/__name__label__/g, index);

                            // Replace '__name__' in the prototype's HTML to
                            // instead be a number based on how many items we have
                            newForm = newForm.replace(/__name__/g, index);

                            // increase the index with one for the next item
                            $collectionHolder.data('index', index + 1);

                            // Display the form in the page in an li, before the "Add a tag" link li
                            var $newFormLi = $('<li></li>').append(newForm);
                            $newLinkLi.before($newFormLi);

                            // add a delete link to the new form
                            addImageFormDeleteLink($newFormLi);
                        }

                        function addImageFormDeleteLink($imageFormLi) {
                            var $removeFormA = $('<a href="#">Supprimer une image</a>');
                            $imageFormLi.append($removeFormA);

                            $removeFormA.on('click', function(e) {
                                // prevent the link from creating a "#" on the URL
                                e.preventDefault();

                                // remove the li for the tag form
                                $imageFormLi.remove();
                            });
                        }
                    </script>

                    <button type="submit">Créer</button>

                    {{ form_end(form) }}

                    </div>