Champ File qui n'apparait pas dans le formulaire (imbriqué)

**pixel016** · 21/11/2014, 09h31

Bonjour à tous,

Petit soucis concernant l'affichage d'un champ file dans un formulaire imbriqué (USER et IMAGE). En effet le champ ne s'affiche pas si l'utilisateur n'a aucune image en BDD.

Pour vous aider voici mon form type USER :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
 
<?php
 
namespace feel\UserBundle\Form;
 
use Symfony\Component\Form\AbstractType;
use Symfony\Component\Form\FormBuilderInterface;
use Symfony\Component\OptionsResolver\OptionsResolverInterface;
 
class UserType extends AbstractType
{
 
    /**
     * @param FormBuilderInterface $builder
     * @param array $options
     */
    public function buildForm(FormBuilderInterface $builder, array $options)
    {
        $builder
            ->add('images','collection', array(
                'type' => new ImageType(),
                'allow_add' => true,
                'empty_data'  => null
            ))
            ->add('username',      'text', array('required' => true))
            ->add('diplome',      'text', array('required' => false))
            ->add('statutFamiliale','choice', array(
                   'choices' => array('' => '- Sélectionner -', 'celibataire' => 'Célibataire', 'divorce' => 'Divorcé'),
                   'required' => false
               ))
            ->add('profession',      'text', array('required' => false))
            ->add('religion',      'text', array('required' => false))
            ->add('enfants',      'text', array('required' => false))
            ->add('codePostal',      'text')
            ->add('films',      'text', array('required' => false))
            ->add('livres',      'text', array('required' => false))
            ->add('artistes',      'text', array('required' => false))
            ->add('soirees',      'text', array('required' => false))
            ->add('voyages',      'text', array('required' => false))
            ->add('attentes',      'text', array('required' => false))
            ->add('qualites',      'text')
            ->add('defauts',      'text')
            ->add('description',      'textarea')
            ->add('hobbies',      'text')
        ;
    }
 
    /**
     * @param OptionsResolverInterface $resolver
     */
    public function setDefaultOptions(OptionsResolverInterface $resolver)
    {
        $resolver->setDefaults(array(
            'data_class' => 'feel\UserBundle\Entity\User'
        ));
    }
 
    /**
     * @return string
     */
    public function getName()
    {
        return 'feel_userbundle_user';
    }
}

Mon formType Image :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
 
<?php
 
namespace feel\UserBundle\Form;
 
use Symfony\Component\Form\AbstractType;
use Symfony\Component\Form\FormBuilderInterface;
use Symfony\Component\OptionsResolver\OptionsResolverInterface;
 
class ImageType extends AbstractType
{
        /**
     * @param FormBuilderInterface $builder
     * @param array $options
     */
    public function buildForm(FormBuilderInterface $builder, array $options)
    {
        $builder
            ->add('file','file')
        ;
    }
 
    /**
     * @param OptionsResolverInterface $resolver
     */
    public function setDefaultOptions(OptionsResolverInterface $resolver)
    {
        $resolver->setDefaults(array(
            'data_class' => 'feel\UserBundle\Entity\Image'
        ));
    }
 
    /**
     * @return string
     */
    public function getName()
    {
        return 'images';
    }
}

La vue de mon formulaire :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
 
{% block content %}
<div class="well block-pink">
{{ form_start(form) }}
    {# Les erreurs générales du formulaire. #}
    {{ form_errors(form) }}
<div id="etape1" class="etape">
    <h3>Etape 1/5</h3>
    <div class="form-group">
      {# Génération du label. #}
      {{ form_label(form.username, "Pseudo* (nom affiché publiquement sur le site)") }}</label>
 
      {# Affichage des erreurs pour ce champ précis. #}
      {{ form_errors(form.username) }}
 
      {# Génération de l'input. #}
      {{ form_widget(form.username, {'attr': {'class': 'form-control'}}) }}
    </div>
 
    <div class="form-group">
      {# Génération du label. #}
      {{ form_label(form.diplome, "Niveau d'étude") }}</label>
 
      {# Affichage des erreurs pour ce champ précis. #}
      {{ form_errors(form.diplome) }}
 
      {# Génération de l'input. #}
      {{ form_widget(form.diplome, {'attr': {'class': 'form-control'}}) }}
    </div>
 
    <div class="form-group">
      {# Génération du label. #}
      {{ form_label(form.statutFamiliale, "Statut Familiale") }}</label>
 
      {# Affichage des erreurs pour ce champ précis. #}
      {{ form_errors(form.statutFamiliale) }}
 
      {# Génération de l'input. #}
      {# Génération de l'input. #}
      {{ form_widget(form.statutFamiliale, {'attr': {'class': 'form-control'}}) }}
    </div>  
 
    <div class="form-group">
      {# Génération du label. #}
      {{ form_label(form.profession, "Profession") }}</label>
 
      {# Affichage des erreurs pour ce champ précis. #}
      {{ form_errors(form.profession) }}
 
      {# Génération de l'input. #}
      {{ form_widget(form.profession, {'attr': {'class': 'form-control'}}) }}
    </div>
 
   <div class="form-group">
      {# Génération du label. #}
      {{ form_label(form.religion, "Religion") }}</label>
 
      {# Affichage des erreurs pour ce champ précis. #}
      {{ form_errors(form.religion) }}
 
      {# Génération de l'input. #}
      {{ form_widget(form.religion, {'attr': {'class': 'form-control'}}) }}
    </div>
    <button id="goToEtape2" type="button" class="btn btn-success suivant etape2 pull-right" data-next="etape2" >Etape suivante</button>
</div>    
 
<div id="etape2" class="etape">
    <h3>Etape 2/5</h3>
          <div class="form-group">
      {# Génération du label. #}
      {{ form_label(form.enfants, "Nombre d'enfants") }}</label>
 
      {# Affichage des erreurs pour ce champ précis. #}
      {{ form_errors(form.enfants) }}
 
      {# Génération de l'input. #}
      {{ form_widget(form.enfants, {'attr': {'class': 'form-control'}}) }}
    </div>
 
          <div class="form-group">
      {# Génération du label. #}
      {{ form_label(form.codePostal, "Code Postal*") }}</label>
 
      {# Affichage des erreurs pour ce champ précis. #}
      {{ form_errors(form.codePostal) }}
 
      {# Génération de l'input. #}
      {{ form_widget(form.codePostal, {'attr': {'class': 'form-control'}}) }}
    </div>
 
          <div class="form-group">
      {# Génération du label. #}
      {{ form_label(form.films, "Films favoris") }}</label>
 
      {# Affichage des erreurs pour ce champ précis. #}
      {{ form_errors(form.films) }}
 
      {# Génération de l'input. #}
      {{ form_widget(form.films, {'attr': {'class': 'form-control'}}) }}
    </div>
 
          <div class="form-group">
      {# Génération du label. #}
      {{ form_label(form.livres, "Livres favoris") }}</label>
 
      {# Affichage des erreurs pour ce champ précis. #}
      {{ form_errors(form.livres) }}
 
      {# Génération de l'input. #}
      {{ form_widget(form.livres, {'attr': {'class': 'form-control'}}) }}
    </div>
    <button id="goToEtape1" type="button" class="btn btn-success precedant pull-left" data-prev="etape1" >Etape précédente</button>
    <button id="goToEtape3" type="button" class="btn btn-success suivant etape3 pull-right" data-next="etape3">Etape suivante</button>
</div>
<div id="etape3" class="etape">  
    <h3>Etape 3/5</h3>
    <div class="form-group">
      {# Génération du label. #}
      {{ form_label(form.artistes, "Artistes favoris") }}</label>
 
      {# Affichage des erreurs pour ce champ précis. #}
      {{ form_errors(form.artistes) }}
 
      {# Génération de l'input. #}
      {{ form_widget(form.artistes, {'attr': {'class': 'form-control'}}) }}
    </div>
 
          <div class="form-group">
      {# Génération du label. #}
      {{ form_label(form.soirees, "Type de soirées favorites") }}</label>
 
      {# Affichage des erreurs pour ce champ précis. #}
      {{ form_errors(form.soirees) }}
 
      {# Génération de l'input. #}
      {{ form_widget(form.soirees, {'attr': {'class': 'form-control'}}) }}
    </div>
 
          <div class="form-group">
      {# Génération du label. #}
      {{ form_label(form.voyages, "Vos voyages favoris") }}</label>
 
      {# Affichage des erreurs pour ce champ précis. #}
      {{ form_errors(form.voyages) }}
 
      {# Génération de l'input. #}
      {{ form_widget(form.voyages, {'attr': {'class': 'form-control'}}) }}
    </div>
 
          <div class="form-group">
      {# Génération du label. #}
      {{ form_label(form.attentes, "Qu'attendez vous du site ?") }}</label>
 
      {# Affichage des erreurs pour ce champ précis. #}
      {{ form_errors(form.attentes) }}
 
      {# Génération de l'input. #}
      {{ form_widget(form.attentes, {'attr': {'class': 'form-control'}}) }}
    </div>
    <button id="goToEtape2" type="button" class="btn btn-success precedant pull-left" data-prev="etape2" >Etape précédente</button>
    <button id="goToEtape4" type="button" class="btn btn-success suivant etape4 pull-right" data-next="etape4">Etape suivante</button>
</div>
<div id="etape4" class="etape">
    <h3>Etape 4/5</h3>
    <div class="form-group">
      {# Génération du label. #}
      {{ form_label(form.qualites, "Vos qualités") }}</label>
 
      {# Affichage des erreurs pour ce champ précis. #}
      {{ form_errors(form.qualites) }}
 
      {# Génération de l'input. #}
      {{ form_widget(form.qualites, {'attr': {'class': 'form-control'}}) }}
    </div>
              <div class="form-group">
      {# Génération du label. #}
      {{ form_label(form.defauts, "Vos défauts") }}</label>
 
      {# Affichage des erreurs pour ce champ précis. #}
      {{ form_errors(form.defauts) }}
 
      {# Génération de l'input. #}
      {{ form_widget(form.defauts, {'attr': {'class': 'form-control'}}) }}
    </div>
              <div class="form-group">
      {# Génération du label. #}
      {{ form_label(form.description, "Description libre") }}</label>
 
      {# Affichage des erreurs pour ce champ précis. #}
      {{ form_errors(form.description) }}
 
      {# Génération de l'input. #}
      {{ form_widget(form.description, {'attr': {'class': 'form-control'}}) }}
    </div>
 
    <div class="form-group">
      {# Génération du label. #}
      {{ form_label(form.hobbies, "Vos hobbies") }}</label>
 
      {# Affichage des erreurs pour ce champ précis. #}
      {{ form_errors(form.hobbies) }}
 
      {# Génération de l'input. #}
      {{ form_widget(form.hobbies, {'attr': {'class': 'form-control'}}) }}
    </div>
    <button id="goToEtape3" type="button" class="btn btn-success precedant pull-left" data-prev="etape3" >Etape précédente</button>
    <button id="goToEtape5" type="button" class="btn btn-success suivant etape4 pull-right" data-next="etape5">Etape suivante</button>
</div>    
<div id="etape5" class="etape">
    <h3>Etape 5/5</h3>
    <div class="form-group">
      {# Génération du label. #}
      {{ form_label(form.images  , "Votre photo") }}</label>
 
      {# Affichage des erreurs pour ce champ précis. #}
      {{ form_errors(form.images) }}
 
      {# Génération de l'input. #}
      {{ form_widget(form.images, {'attr': {'class': 'form-control'}}) }}
    </div>
    <!--<div id="svgAvatars"></div>-->
    <button id="goToEtape4" type="button" class="btn btn-success precedant pull-left" data-prev="etape4" >Etape précédente</button>
</div>
 
    <input type="submit" class="btn btn-primary center-block" value="Enregistrer" />
 
 
    {{ form_rest(form) }}
 {{ form_end(form) }}
 
  <div class="progress">
    <div class="progress-bar progress-bar-striped active"  role="progressbar" aria-valuenow="45" aria-valuemin="0" aria-valuemax="100" style="width: 0%">
 
    </div>
  </div>
</div>
{% endblock %}

Si vous avez une piste je suis preneur car rien trouvé sur google et je ne vois pas du tout quoi faire.

Mercii

**Nico_F** · 21/11/2014, 10h20

Et si ton user possède déjà deux photos, tu as deux champs file ?

Je pense qu'il te manque la partie ou tu ajoutes dynamiquement les champs de formulaire en passant par du javascript : un petit bouton [Add image] pour rajouter en js un champs input file dans ton formulaire. L'ajout dynamique de champs est possible avec Symfony puisqu'il stocke le prototype de ton champs dans un data attribute quelque part dans le form. Ce qui te permet de copier le contenu et de l'ajouter en js dans le html pour avoir un champs supplémentaire.

Toute cette partie est très bien expliquée sur cette page de la documentation. Il y a même le jQuery qui va avec, reste plus qu'à remplacer "tag" dans l'exemple par ton "image".

**pixel016** · 24/11/2014, 11h12

Merci Nico, ça fonctionne, par contre la soumission ne fonctionne pas car il ne récupère pas mon ID de l'utilisateur en cours (pourtant je l'ai géré, je repost dans l'autre sujet du coup

)

Champ File qui n'apparait pas dans le formulaire (imbriqué)

Symfony PHP

Discussions similaires

Partager

Partager