basculer la premiere colonne de tableau en dernier et affichage rtl

**yacine.dev** · 06/01/2010, 11h55

bonjour

je cherche a inverser les collone d'un tableau
exemple

(tableau)les collones

col1 col2 col3
nom -prenon-date de naissance

je veux qu le tableau change le classement de ces collonnes avec une fonction javascript (sous une condition :exemple lutilsateur utilise la langue arabe) ou avec un attribut css appliqué sur un tableau qui rend le tableau lisible du coté droit.

comme ça
le classement collones est inversé
col3 col2 col1
date de naissance - prenon - nom (lisible du coté droit)

ce probleme est survenu quand j'esseye d'utiliser la meme page html de français ou englai pour l'arabe car l'arabe se lit du coté droit a gauche

merci de lire mon message
j'attends votre reponse

**SpaceFrog** · 06/01/2010, 12h12

il suffit de faire un appendChild du premier td dans le tr pour chaque tr

**yacine.dev** · 06/01/2010, 12h39

inverser les colonnes de tableau le premier devien ledernier et le deuxieme devien l'avant dernier et ainsi de suite cest simple je lai trouvé

por ta reponse tu n'a pas compris ce n'est pa que le premier collone mais tous les colonnes de tableau

il suffit d'appliquer l'attribut css2 direction sur le tableau

<table style="direction:rtl">
collne1 va etre dessiner adroite pas a gauche
</table>
direction:rtl c'est a dire right to left

par defaut cest direction:ltr left to right

c'est pour supporter la langues qui se lit de droite a gauche ex:arabe

merçi

**SpaceFrog** · 06/01/2010, 12h50

Je pense que le ltr sur la page influe aussi sur l'ordre des tds dasn les tr ...

sinon il faudra faire un test si on est en ltr ou rtl et faire un insertBefore

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
 
 <html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
 
<title>Nouvelle page 1</title>
<script type='text/javascript'>
/***************************
* Speed Table By SpaceFrog *
**************************/
 
function BuildTable(DestObj,NrLines,NbrCells){
var BaliseTable=document.createElement('table');
BaliseTable.id="tableau"
var BaliseTbody=document.createElement('tbody');
 
for(i=0;i<NrLines;i++){
 new AddLine(BaliseTbody,NrLines,NbrCells, i)
 }
 
BaliseTable.appendChild(BaliseTbody);
DestObj.appendChild(BaliseTable);
document.close();
}
 
function AddLine(DestBody,NrLines,NbrCells, Contenu){
var NewLine=document.createElement('tr');
for(l=0;l<NbrCells;l++){
     new AddCells(NewLine,Contenu+'_'+l);
     }
DestBody.appendChild(NewLine)      
 
}
 
function AddCells(DestLine,contenu){
var newCell=document.createElement('td');
newCell.style.border="solid 1px gray";
newCell.appendChild(document.createTextNode(contenu));
DestLine.appendChild(newCell);
}
 
 
function swaptd(){ 
var tabtrs=document.getElementById('tableau').getElementsByTagName('tr');
var i=0;
while (tabtrs[i++]){
 tabtrs[i-1].appendChild(tabtrs[i-1].getElementsByTagName('td')[0])
 i++
 }
}
 
</script>
 
 
 
 
</head>
 
<body onload="BuildTable(document.body,20,6)">
<input type="button" onclick="swaptd()" value="inverser" />
 
 
</body>
 
</html>

**yacine.dev** · 06/01/2010, 12h55

oui mais moi je, sais bien que rlt ou ltr parceque l'utilisateur a deja choisi la laungue donc je mets tous le tableau a direction:rtl parceuqe je veux meme qu il s'applique sur les <td>sur presuqe toutes la page
et merçi

**SpaceFrog** · 06/01/2010, 13h01

as tu tesé mon code ???

je viens de le tester en rtl ...
pour moi ça fonctionne ou alors je n'ai pas compris ce que tu veux ...

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
 
 
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
 
<title>Nouvelle page 1</title>
<script type='text/javascript'>
/***************************
* Speed Table By SpaceFrog *
**************************/
 
function BuildTable(DestObj,NrLines,NbrCells){
var BaliseTable=document.createElement('table');
BaliseTable.id="tableau"
var BaliseTbody=document.createElement('tbody');
 
for(i=0;i<NrLines;i++){
 new AddLine(BaliseTbody,NrLines,NbrCells, i)
 }
 
BaliseTable.appendChild(BaliseTbody);
DestObj.appendChild(BaliseTable);
document.close();
}
 
function AddLine(DestBody,NrLines,NbrCells, Contenu){
var NewLine=document.createElement('tr');
for(l=0;l<NbrCells;l++){
     new AddCells(NewLine,Contenu+'_'+l);
     }
DestBody.appendChild(NewLine)      
 
}
 
function AddCells(DestLine,contenu){
var newCell=document.createElement('td');
newCell.style.border="solid 1px gray";
newCell.appendChild(document.createTextNode(contenu));
DestLine.appendChild(newCell);
}
 
 
function swaptd(){ 
var tabtrs=document.getElementById('tableau').getElementsByTagName('tr');
var i=0;
while (tabtrs[i++]){
 tabtrs[i-1].appendChild(tabtrs[i-1].getElementsByTagName('td')[0])
 i++
 }
}
 
</script>
 
 
 
 
</head>
 
<body onload="BuildTable(document.body,20,6)" style="direction:rtl">
<input type="button" onclick="swaptd()" value="inverser" />
 
 
</body>
 
</html>

basculer la premiere colonne de tableau en dernier et affichage rtl

JavaScript

Vue hybride

Discussions similaires

Partager

Partager