moveRow : bête noire de FF

**linar009** · 22/08/2006, 13h36

Bonjour,

Pour le déplacement de lignes dans un tableau HTML, j'ai trouvé l'excellente méthode moveRow qui effectue le déplacement de lignes facilement et rapidement.
Bien sûr, cette méthode ne fonctionne pas sous FireFox.
Auriez-vous une idée de fonction qui permettrait aux utilisateurs de Firefox de pouvoir déplacer des lignes d'un tableau ?

J'avais ça :

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
function moveRow(targetRow, newIndex, nomTable) { 
 
  if (newIndex > targetRow.rowIndex) {
    newIndex++;
  }
  var table = document.getElementById(nomTable);
  var newRow = table.insertRow(newIndex);
 
  for (var i=0; i<targetRow.cells.length; i++) {
    var oldCell = targetRow.cells[i];
    var newCell = document.createElement("TD");
    newCell.innerHTML = oldCell.innerHTML;
    newRow.appendChild(newCell);
  }
  table.deleteRow(targetRow.rowIndex); 
}

Mais ça ne marche pas des masses ...

**FremyCompany** · 22/08/2006, 13h58

Et ca ?

Code :

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

1
2
3
4
5
6
7
8
9
function moveRow(targetRow, newIndex, nomTable) { 
  if (newIndex > targetRow.rowIndex) {
    newIndex++;
  }
  var table = document.getElementById(nomTable);
  var newRow = table.insertRow(newIndex);
  newRow.innerHTML=targetRow.innerHTML;
  table.deleteRow(targetRow.rowIndex); 
}

**linar009** · 23/08/2006, 09h32

Merci Fremy ça marche impec
Mais uniquement sur FF maintenant...

**FremyCompany** · 23/08/2006, 10h08

Envoyé par linar009

Merci Fremy ça marche impec
Mais uniquement sur FF maintenant...

Code :

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

1
2
3
4
5
if (document.all && window.ActiveXObject) {
    // Méthode IE
} else {
    // Méthode FF
}

**linar009** · 23/08/2006, 10h39

Merci Fremy !

**javatwister** · 23/08/2006, 11h15

alternative?

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
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>...</title>
 
 
<style type="text/css">
 
 
#ta {
margin:100px;
padding:0px;
font-weight:bold;
border-collapse:collapse;
}
 
#ta td {
border:2px solid #000000
}
 
label {
font-weight:bold;
}
 
</style>
 
</head>
 
<body>
 
 
<table id="ta">
<tr>
	<td>un</td>
	<td>deux</td>
	<td>trois</td>
</tr>
<tr>
	<td>quatre</td>
	<td>cinq</td>
	<td>six</td>
</tr>
<tr>
	<td>sept</td>
	<td>huit</td>
	<td>neuf</td>
</tr>
<tr>
	<td>dix</td>
	<td>onze</td>
	<td>douze</td>
</tr>
<tr>
	<td>treize</td>
	<td>quatorze</td>
	<td>quinze</td>
</tr>
<tr>
	<td>seize</td>
	<td>dix-sept</td>
	<td>dix-huit</td>
</tr>
 
</table>
 
 
<p>
<label for="texte">Après avoir sélectionné une ligne, entrez le nouvel index choisi ou"sup"</label>
<input type="text" id="texte" size="2" />
</p>
 
 
<script type="text/javascript">
 
 
var txt=document.getElementById("texte");
var tb=document.getElementById("ta").tBodies[0];
var r=tb.rows;
 
var ind;
 
for(i=0;i!=r.length;i++){
	r[i].onclick=function(){
		if(ind){
			ind.style.backgroundColor="#ffffff"
		};
 
		ind=this;
		ind.style.backgroundColor="#ff0000";
	}
}
 
txt.onchange=function(){
	if(ind){
		if(r[this.value]){
			tb.insertBefore(ind,r[this.value])
		}
		else if(this.value>=r.length){
			tb.appendChild(ind)
		}
		else if(this.value=="sup"){
			if(confirm("Etes-vous sûr de vouloir supprimer cette ligne?")){
				tb.removeChild(ind)
			}
		}
	}		
}
 
 
</script>
 
</body>
</html>