Ascenseurs horizontal et vertical dans un tableau

**pc75** · 17/02/2009, 13h49

Bonjour,

Je génère de façon dynamique un tableau (balise <table>) qui affiche un planning. Je ne connais donc pas à l'avance les dimensions de mon tableau.

J'ai les noms en première colonne, et les dates en première ligne.

Existe-t-il un moyen de pouvoir scroller horizontalement et verticalement dans ce tableau en gardant fixes la première colonne et la première ligne ?

Merci.

PS : Sachant que je ne suis pas du tout expert en javascript.

**le_chomeur** · 17/02/2009, 13h58

non , pas directement , il te faut mettre tes entete en dehors du tableau, puis ton tableau dans une div avec une hauteur/largeur fixe et en propriété css : overflow:auto;

**Bovino** · 17/02/2009, 14h00

Je pense que le plus simple pour toi sera de créer un tableau avec tes cellules de titre, puis les données dans un autre tableau à l'intérieur (en utilisant rowspan et colspan) qui lui sera scrollable...

EDIT :
Par exemple :

Code html :

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

1
2
3
4
5
6
7
8
9
10
11
<table>
  <tr>
    <td>Col1</td><td>Col2</td><td>Col3</td>
  </tr>
  <tr>
    <td>Ligne2</td><td colspan="2" rowspan="2">Là ton autre table</td>
  </tr>
  <tr>
    <td>Ligne3</td>
  </tr>
</table>

**pc75** · 17/02/2009, 14h38

Re,

Merci de vos réponses, mais je n'ai surement pas été assez clair.

Mon problème est plus compliqué, voire irréalisable.

Je souhaite que :

- quand je scrolle verticalement, toutes les lignes (les noms ET les cellules représentant les dates) défilent, et que la ligne d'entête (les dates) reste fixe.

- quand je scrolle horizontalement, toutes les colonnes (les dates ET les cellules représentant les dates) défilent, et que la colonne de gauche (les noms) reste fixe.

Un peu comme sous Excel quand on fige les volets.

Merci.

**le_chomeur** · 17/02/2009, 14h51

. . . exactement la solution que j'ai donnée !!
essaye au moins .....

**pc75** · 17/02/2009, 14h58

Envoyé par le_chomeur

. . . exactement la solution que j'ai donnée !!
essaye au moins .....

Avant que j'essaie de me lancer, dans ton message précédent, tu écris :

il te faut mettre tes entete en dehors du tableau

Comment les dates vont pouvoir défiler en scrollant horizontalement ?

Il y a un truc que je ne pige pas (je suis très en dessous de la moyenne en JS).

Merci en tous cas de m'aider.

**pc75** · 18/02/2009, 15h41

Envoyé par le_chomeur

. . . exactement la solution que j'ai donnée !!
essaye au moins .....

Bon, j'ai essayé, rien ne fonctionne. Je n'ai même pas d'ascenseur.

Si quelqu'un voit où j'ai merdé ?

Merci

**le_chomeur** · 18/02/2009, 15h54

le code ???

**pc75** · 18/02/2009, 16h26

Oups !

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
238
239
240
241
242
243
244
245
246
 
<table border="4" width="100%">
	<tr>
		<td nowrap rowspan="2" bgcolor="white">
			<font face="arial" color="black" size="2">
			<strong>
			Noms
			</strong>
			</font>
		</td>
		<%
		' Entête des colonnes (jours)
		Deb1 = Str_Debut
		Fin1 = Str_Fin
		Do while DateDiff("d", Deb1, Fin1) >= 0
			%>
			<td nowrap align="center" bgcolor="white">
				<font face="arial" color="black" size="2">
				<strong>
				<%=WeekDayName(WeekDay(Deb1, vbMonday), True, vbmonday)%>
				</strong>
				</font>
			</td>
			<%
			Deb1 = DateAdd("d", 1, Deb1)
		Loop
	%>
	</tr>
 
	<tr>
		<%
		' Entête des colonnes (dates)
		Deb1 = Str_Debut
		Fin1 = Str_Fin
		set rs1 = Server.CreateObject("ADODB.Recordset")
		Do while DateDiff("d", Deb1, Fin1) >= 0
			' La date est-elle en congé scolaire ?
			JourSco = Month(Deb1) & "/" & Day(Deb1) & "/" & Year(Deb1)
			SQLtemp = ""
			SQLtemp = SQLtemp & "select * from TBL_CONGSCOL "
			SQLtemp = SQLtemp & "where SCO_DEBUT <= #" & JourSco & "# "
			SQLtemp = SQLtemp & "  and SCO_FIN >= #" & JourSco & "# "
			rs1.open SQLtemp, Application("DsnODBC")
			if rs1.EOF then
				NewColor = "white"
			else
				NewColor = "PaleGreen"
			end if
			rs1.Close
			%>
			<td nowrap align="center" bgcolor="<%=NewColor%>">
				<font face="arial" color="black" size="2">
				<strong>
				<%=Day(Deb1) & "-" & Month(Deb1)%>
				</strong>
				</font>
			</td>
			<%
			Deb1 = DateAdd("d", 1, Deb1)
		Loop
		set rs1 = Nothing
	%>
	</tr>
 
</table>
<div style="overflow:auto;" height="10px" width="100%">
<table width="100%">
<tr>
 
	<%
	set rsConges = Server.CreateObject("ADODB.Recordset")
	do while not rstemp.EOF
		' Récupération du semainier de l'agent
		Str_Agent = rstemp("AGT_NOM") & " " & rstemp("AGT_PRENOM")
		Str_Lundi = rstemp("SEM_LUNDI")
		Str_Mardi = rstemp("SEM_MARDI")
		Str_Mercredi = rstemp("SEM_MERCREDI")
		Str_Jeudi = rstemp("SEM_JEUDI")
		Str_Vendredi = rstemp("SEM_VENDREDI")
		Str_Samedi = rstemp("SEM_SAMEDI")
		Str_Dimanche = rstemp("SEM_DIMANCHE")
		%>
		<td align="left" bgcolor="white" nowrap>
			<font face="arial" color="black" size="2">
			<strong>
			<%=Str_Agent%>
			</strong>
			</font>
		</td>
		<%
		Deb = Str_Debut
		Fin = Str_Fin
		Do while DateDiff("d", Deb, Fin) >= 0
			if WeekDay(Deb, vbMonday) = 1 and Str_Lundi = "N" then
				Str_Color = "green"
				NbChomes = NbChomes + 1
			elseif WeekDay(Deb, vbMonday) = 2 and Str_Mardi = "N" then
				Str_Color = "green"
				NbChomes = NbChomes + 1
			elseif WeekDay(Deb, vbMonday) = 3 and Str_Mercredi = "N" then
				Str_Color = "green"
				NbChomes = NbChomes + 1
			elseif WeekDay(Deb, vbMonday) = 4 and Str_Jeudi = "N" then
				Str_Color = "green"
				NbChomes = NbChomes + 1
			elseif WeekDay(Deb, vbMonday) = 5 and Str_Vendredi = "N" then
				Str_Color = "green"
				NbChomes = NbChomes + 1
			elseif WeekDay(Deb, vbMonday) = 6 and Str_Samedi = "N" then
				Str_Color = "black"
				NbChomes = NbChomes + 1
			elseif WeekDay(Deb, vbMonday) = 7 and Str_Dimanche = "N" then
				Str_Color = "black"
				NbChomes = NbChomes + 1
			elseif IsFerie(Deb) then 'and WeekDay(Deb, vbMonday) <> 6 and WeekDay(Deb, vbMonday) <> 7 then
				Str_Color = "black"
				NbFeries = NbFeries + 1
			else
				' L'agent est-il en congé ce jour là ?
				Str_Jour = Month(Deb) & "/" & Day(Deb) & "/" & Year(Deb)
				SQLtemp = ""
				SQLtemp = SQLtemp & "select DEM_STATUT, DEM_ID from TBL_DEMANDES "
				SQLtemp = SQLtemp & "where DEM_DEBUT <= #" & Str_Jour & "# "
				SQLtemp = SQLtemp & "  and DEM_FIN >= #" & Str_Jour & "# "
				SQLtemp = SQLtemp & "  and AGT_MATRICULE = '" & rstemp("AGT_MATRICULE") & "' "
				rsConges.cursorlocation = aduseclient
				rsConges.cachesize = 5
				rsConges.open SQLtemp, Application("DsnODBC")
				if rsConges.RecordCount > 0 then
					Str_Id = rsConges("DEM_ID")
					if rsConges("DEM_STATUT") = "O" then
						Str_Color = "Yellow"
					else
						Str_Color = "Silver"
					end if
				else
					Str_Id = ""
					Str_Color = "white"
				end if
				rsConges.close
				NbOuvres = NbOuvres + 1
			end if
			%>
 
			<%
			if Len(Trim(Str_Id)) > 0 then
				%>
				<td title="Détail" onclick="Fiche(<%=Str_Id%>)" style="cursor:hand;" align="center" bgcolor="<%=Str_Color%>" nowrap>
				<%
			else
				%>
				<td align="center" bgcolor="<%=Str_Color%>" nowrap>
				<%
			end if
			%>
 
				<font face="arial" color="white" size="2">
				<strong>
				&nbsp;
				<%'=Day(Deb) & "-" & Month(Deb)%>
				</strong>
				</font>
			</td>
			<%
			Deb = DateAdd("d", 1, Deb)
		Loop
		rstemp.MoveNext
	%>
	</tr>
	<%
	Loop
		%>
</table>
 
</div>
 
<br><br>
 
<div>
<table align="left">
	<tr>
		<td bgcolor="Yellow">
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
		</td>
		<td>
			<font face="arial" size="2">
			<strong>
			Congé(s) validé(s)
			</strong>
			</font>
		</td>
	</tr>
 
	<tr>
		<td bgcolor="Silver">
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
		</td>
		<td>
			<font face="arial" size="2">
			<strong>
			Congé(s) prévu(s)
			</strong>
			</font>
		</td>
	</tr>
 
	<tr>
		<td bgcolor="white">
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
		</td>
		<td>
			<font face="arial" size="2">
			<strong>
			Jour(s) ouvré(s)
			</strong>
			</font>
		</td>
	</tr>
 
	<tr>
		<td bgcolor="green">
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
		</td>
		<td>
			<font face="arial" size="2">
			<strong>
			Temps partiel
			</strong>
			</font>
		</td>
	</tr>
 
	<tr>
		<td bgcolor="black">
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
		</td>
		<td>
			<font face="arial" size="2">
			<strong>
			W.E. et jour(s) ferié(s)
			</strong>
			</font>
		</td>
	</tr>
</table>
</div>

Merci

**pc75** · 19/02/2009, 15h44

Re,

C'est bon, ça fonctionne.

Ascenseurs horizontal et vertical dans un tableau

JavaScript

Discussions similaires

Partager

Partager