Discussion :

[bloodangel78]

Salut,

je souhaiterais afficher une liste d'image que l'on peux selectionner avec une checkbox dans un formulaire.

En gros je voudrais une liste du genre:

Code :

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

1
2
3
4
<div>
    <img></img>
    <input type="checkbox"></input>
</div>

Voir en bas de cette page pour un exemple:
http://template.walkingpixels.com/organon/gallery.html

Comment faire cela avec Symfony2?
Pas trouvé de tuto avec Google (ptetre pas utilisé les bons termes).


ps: J'ai déjà fait la partie ou je passe à mon formulaire un tableau de la sorte:

array(
'http://test.com/image1.jpg',
'http://test.com/image2.jpg',
'http://test.com/image3.jpg'
)

Pour l'instant ca affiche une liste de checkbox avec comme label l'url des images.

[Nico_F]

Il n'y a rien de particulier à faire avec Symfony, ce n'est que du HTML & CSS.

Une fois que tu sais le faire en HTML, dans ta template, tu remplaces ton <input type="checkbox"/> par le rendu de ton élément de formulaire avec twig.

Code :

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

{{ form_widget(form.monChamp) }}

++

[bloodangel78]

Justement c'est quand je mets ta ligne de code que ça m'affiche une liste de checkbox mais avec l'url au lieu de l'image.

Il manque la code html <img></img>

[frfrance31]

Bonjour,

Utilisation des liens avec Twig et Symfony2.

[arnooo999]

Bonjour,

Il faut personaliser le rendu de ton formulaire dans ta template twig, le champ entity étant composé de plusieurs sous formulaire il suffit de faire une itération:

Code :

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

1
2
3
4
5
6
7
8
9
 
{%for fieldImage in form.images%}
  <div class="img_checkbox">
   {{form_widget(fieldImage)}}{#pour rendre le input  checkbox#}
   <img src="{{fieldImage.vars.label}}"/>{# pour connaitre les variables disponible dans ton sous-formulaire utilises: {{dump(fieldImage)}} #}
  </div>
{%endfor%}
 
{{form_rest(form)}}

tu peux aussi utiliser le form_theming :
http://symfony.com/fr/doc/current/co...omization.html

[bloodangel78]

Merci arnooo999, c'est exactement ce que je cherchais à faire.