Discussion :

[Ownview]

Bonjour, aujourd'hui, je souhaiterai faire une liste accordéon pour mes tableaux. Auparavant, j'avais effectué une boucle qui m'affichait 1 tableau par film (titre, date, acquisition, synopsis, nombre de cd etc...) mais ça me prenait une place folle et une scroll bar immense !!!

J'aimerai donc créer cette liste:

$titre [clique]

->Tableau

$titre [clique]

->Tableau

$titre [clique]

->Tableau

$titre [clique]

->Tableau

...

J'ai donc, dans ma vue fait :

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
{% block body %}
<div class="span6">
    <div class="page-header">
    	<h1>Liste des Films </h1>
    </div>
</div>
 
<div class="row-fluide">
<div class="span5 offset1 bs-docs-sidebar">  	
 
 
 
{% for Film in film %}
 
<div class="accordion" id="accordion2">
  <div class="accordion-group">
    <div class="accordion-heading">
      <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapse{{nb}}">
			Film     
		</a>
    </div>
    <div id="collapse{{nb}}" class="accordion-body collapse in">
      <div class="accordion-inner">
 
 
      <table class="table table-striped"
            	<tr>
            		<td><b>Titre : </b></td>
               		<td>{{ Film.titre }}</td>
               	</tr>
 
               	<tr> 
               		<td><b>Date acquisition :</b> </td>           		
                	<td>{{ Film.dateAcquisition|date }}</td> 
                </tr>
 
                <tr>
               		<td><b>Année production : </b></td> 
                	<td>{{ Film.anneeProduction }}</td>
                </tr>
 
                <tr>
                    <td><b>Date de sortie : </b></td>
                	<td>{{ Film.dateSortie|date }}</td>
               	</tr> 
 
               	<tr>
               		<td><b>Durée du film : </b></td>
				    <td>{{ Film.duree }}</td>
				</tr>
 
				<tr> 
					<td><b>Langue : </b></td>
                	<td>{{ Film.langueId }}</td>
                </tr>
 
                <tr>
                	<td><b>Genre ID : </b></td> 
                	<td>{{ Film.genreId }}</td> 
                </tr>
 
                <tr>
                	<td><b>Saga ID : </b></td>
                	<td>{{ Film.sagaId }}</td>
                </tr>
 
                <tr> 
                	<td><b>Acteur ID : </b></td>
                	<td>{{ Film.acteurId }}</td>
                </tr>
 
                <tr>
                	<td><b>Synopsis : </b></td>
                	<td>{{ Film.synopsis }}</td>
                </tr>
 
                <tr>
                	<td><b>Support ID : </b></td> 
                	<td>{{ Film.supportId }}</td>
                </tr>
 
                <tr>
                	<td><b>Nombre de disque : </b></td> 
                	<td>{{ Film.nbDisque }}</td>
                </tr>
 
                <tr>
                	<td><b>Emprunté : </b></td> 
                	<td>{{ Film.emprunte }}</td>
                </tr>
 
                <tr>
                	<td><b>Adherent ID : </b> </td>
                	<td>{{ Film.adherentId }}</td>
                </tr>  
 
                <tr>
                	<td><b>Observations : </b></td> 
                	<td>{{ Film.observations }}</td>
                </tr>
 
                <tr>  
                	<td><b>Vignettes : </b></td>
                	<td>{{ Film.vignettes }}</td>
                </tr>
 
                <tr> 
                	<td><b>Affiche : </b></td> 
              		<td>{{ Film.affiche }}</td>
              	</tr>
 
              	<tr>
              		<td><b>Video : </b></td> 
                	<td>{{ Film.video }}</td>
                </tr>
 
                <tr> 
                	<td><b>Archiver : </b></td> 
                	<td>{{ Film.archiver }}</td> <br/> <br/><br/>
            </tr>
 
                        </table>
 
      </div>
    </div>
  </div>
</div>
 
{% endfor %}
 
 
 
 
 
 
{% endblock %}

Dans mon controlleur :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
public function ListeAction()
	{	
		$nb=0;
		$films = $this->getDoctrine()
		->getRepository('AscavideoBundle:film')
		->findall();
 
		return $this->render("AscavideoBundle:GestionFilm:liste.html.twig", array(
				'film' => $films
		));
 
	}

Et j'obtiens l'erreur :

Variable "nb" does not exist in AscavideoBundle:GestionFilm:liste.html.twig at line 25

Auriez-vous une petite idée?

Merci

[Nico_F]

Tu n'a pas passé la variable nb dans ton template.

Code :

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

1
2
3
4
return $this->render("AscavideoBundle:GestionFilm:liste.html.twig", array(
	'film' => $films,
	'nb' => $nb
));

[Ownview]

Je revois ma liste mais les accordéons sont déployés :/

[Nico_F]

Tu déclares autant d'accordéons que de passages dans ta boucle ; déjà pour commencer il ne faut en déclarer qu'un seul et boucler sur les accordion-group.

Il faut que tu sortes cette ligne de ta boucle en la mettant au dessus du départ de ton for :

Code :

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

<div class="accordion" id="accordion2">

et par la même occasion la div fermante après la fin de la boucle.

Ensuite la classe "in" (ligne 22) permet d'avoir un panneau ouvert, là en l’occurrence elle est présente dans la boucle donc pour chaque élément : raison pour laquelle ton accordéon est entièrement ouvert. Il te suffit de faire une condition sur l'inclusion de cette classe pour garder ouverts que ceux que tu désires garder ouverts. Ou bien supprimer totalement la classe in pour que ton accordéon soit complètement fermé.

[Ownview]

Si j'enleve la ligne ça me fait quelque chose de très étrange pour le coups

Si je met juste :

Code :

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

<div id="collapse{{nb}}" >

ça ne change rien

[Ownview]

j'ai mis

Code :

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

<div id="collapse{{nb}}" class="accordion-body collapse">

mes panneaux sont replier mais quand je clique, je n'ai rien qui s'ouvre :/

[Ownview]

Uu je suis perdue

[Nico_F]

Incrémenter la variable nb à la fin de la boucle ça pourrait être utile pour avoir des id différents ... mmh 'voyez

[Ownview]

Mes collapse s'incrémentent

[Ownview]

Mais ils ne s'ouvrent toujours pas

[Nico_F]

Il manque le chevron fermant à la fin de ta balise ouvrante de table.

[Ownview]

Cela ne change rien :/ ( j'ai corrigé Merci )

[Ownview]

C'est résolu. Les chemin vers le JS était foireux

[bloodangel78]

Go installer Firebug sur ton navigateur.
Tu l'aurais vu de suite.