Mise à jour des parties date et table de la FAQ JavaScript

Le 2013-02-25 10:45:04, par vermine, Expert éminent sénior

Bonjour à tous,

Après un travail collectif (toujours en cours, d'ailleurs !), deux parties de la FAQ JavaScript ont été mises à jour : les dates et les tables.

Par la même occasion, des petites coquilles ont été corrigées et des remarques ont été ajoutées. De nouvelles Q/R ont d'ailleurs fait leur apparition, parfois issues d'une scission de Q/R existantes.

Nous tenons à remercier l'ensemble des contributeurs et particulièrement Auteur aidé par NoSmoking et arnogues. ()

FAQ JavaScript

Malgré la relecture attentive, il est toujours possible que des erreurs subsistent, n'hésitez pas à les signaler.
De nouvelles mises à jour se feront prochainement. Votre aide est la bienvenue sur le forum de travail.

Discussion forum

13 commentaires

Arno_94
Membre averti
Bonjour à tous et toutes,

Je me permets de réagir sur la mise à jour JS concernant les tables et notamment l'article intitulé :

Comment mettre un scrollbar à gauche sur un tableau ?

En effet, je pense avoir une solution différente qui offre une fonctionnalité en plus : la possibilité d'utiliser la roulette de la souris sur le tableau.

Pour obtenir ce résultat, il suffit d'encadrer le tableau par un div avec les attributs suivants :
Code html :
```
<div dir="rtl" style="height:100px;overflow-y:scroll;overflow-x: hidden;float:left"><table>...</table></div>
```
C'est bien entendu l'attribut dir="rtl" qui permet simplement d'inverser la position de la scrollbar (rtl = right to left).

J'ai mis "float:left" de manière à s'adapter à la width du tableau mais on peut le remplacer par une valeur width précise pour obtenir le même résultat. Toutefois, la taille de la scrollbar étant dépendante du système, la solution float semble plus adaptée.

En espérant que cela puisse servir, encore merci pour tout le travail fourni par l'équipe de Developpez.com
le 27/02/2013 à 17:38
vermine
Expert éminent sénior

C'est en ligne.

le 06/03/2013 à 10:45
j'ai pu noter une erreur
Code :
```
return Math.ceil((Diff/div));
```
il y a des parenthese en trop
le 26/02/2013 à 13:20

Auteur

Expert éminent sénior

Bonjour,

je me permets de corriger ton code :

Code html :

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
<div dir="rtl" style="height:100px;overflow-y:scroll;"> 
<table border="1" style="width:100%" dir="ltr"> 
<tr> 
<td> bla bla bla bla</td> 
<td> bla bla bla bla</td> 
<td> bla bla bla bla</td> 
</tr> 
<tr> 
<td> bla bla bla bla</td> 
<td> bla bla bla bla</td> 
<td> bla bla bla bla</td> 
</tr> 
<tr> 
<td> bla bla bla bla</td> 
<td> bla bla bla bla</td> 
<td> bla bla bla bla</td> 
</tr> 
<tr> 
<td> bla bla bla bla</td> 
<td> bla bla bla bla</td> 
<td> bla bla bla bla</td> 
</tr> 
<tr> 
<td> bla bla bla bla</td> 
<td> bla bla bla bla</td> 
<td> bla bla bla bla</td> 
</tr> 
<tr> 
<td> bla bla bla bla</td> 
<td> bla bla bla bla</td> 
<td> bla bla bla bla</td> 
</tr> 
</table> 
</div>

en avec l'attribut dir="rtl" la barre de défilement est certes à gauche mais le texte de la table s'écrit également de droite à gauche (mis en évidence par l'attribut width:100% sur la table). Par conséquent, il faut ajouter dans la balise table l'attribut inverse : dir="ltr". J'ai également supprimé l'attribut float:left et l'overflow-x:hidden également
Merci pour ta suggestion

le 03/03/2013 à 22:15

sekaijin

Expert éminent

J'ai une remarque concernant les tables html
la FAQ commence par un exemple de table HTML

Code html :

1
2
3
4
5
6
7
8
9
10
11
12
<table id="idTable"> 
	<tr> 
		<td> Ligne 0 Cellule 0 
		</td> 
		<td> Ligne 0 Cellule 1 
		</td> 
		<td> Ligne 0 Cellule 2 
		</td> 
		<td> Ligne 0 Cellule 3 
		</td> 
	</tr> 
</table>

Or la norme prévoie que le TR doit être placé dans un THAED, TBODY ou TFOOT

les navigateur tel IE vont d'eux même ajouter un TBODY pour corriger ce manque.

ne serait-il pas opportun de présenter directeent un exemple conforme à la norme ??

Code html :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<table id="idTable"> 
  <tbody> 
	<tr> 
		<td> Ligne 0 Cellule 0 
		</td> 
		<td> Ligne 0 Cellule 1 
		</td> 
		<td> Ligne 0 Cellule 2 
		</td> 
		<td> Ligne 0 Cellule 3 
		</td> 
	</tr> 
  </tbody> 
</table>

A+JYT

le 25/02/2013 à 19:08

Bovino
Rédacteur

Pas tout à fait d'accord... HTML autorise la présence de <tr> sans <tbody> :

Envoyé par Permitted contents

an optional caption element, followed by zero or more colgroup elements, followed by an optional thead element, followed by

one tfoot element, followed by

zero or more tbody elements, or one or more tr elements

or

zero or more tbody elements, or one or more tr elements

followed by an optional tfoot element

Source.

Table rows may be grouped into a head, foot, and body sections

Source HTML 4.

le 26/02/2013 à 8:15
vermine
Expert éminent sénior

Restons sur la première version alors.

le 26/02/2013 à 8:22
vermine
Expert éminent sénior

Bien vu !

le 26/02/2013 à 13:30
Auteur
Expert éminent sénior
Envoyé par mekal

j'ai pu noter une erreur

Code :

return Math.ceil((Diff/div));

il y a des parenthese en trop
dans quelle Q/R ?
le 26/02/2013 à 14:34
vermine
Expert éminent sénior

Non mais c'est vrai ça d'abord ?! Je ne vois rien de tout ça.

C'était dans le calcul des différences entre deux dates.

le 26/02/2013 à 15:39

Poster une réponse