probleme de script pour trier dynamiquement un tableau

**K_!!!** · 16/02/2006, 13h49

bonjour,

je cherche a trier un tableau dynamiquement, en cliquant sur les entetes des colonnes .
n'etant pas tres cale en javascript mais disposant d'un livre dessus, je me suis contenter de recopier un code present dans le livre a titre de test ( je sais que ce n'est pas ca qui va me faire comprendre mais bon...). je pensait que ca aurait marcher mais voila je n'ai pas d'erreur de script mais des que je clique sur une entete , la page se bloque et un message apparait :

" a script on this page is causing Internet Explorer to run slowly...."

je voudrais savoir si vous pouvier m'eclairer et me dire qu'est ce qu'il ne va pas , merci d'avance

voici le code javascript :

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
 
function TableSorter()
{
 
	var compare = function (a, b){
		if(a.toLowerCase() < b.toLowerCase())
		return -1
		if(a.toLowerCase() > b.toLowerCase())
		return 1
		return 0
	}
 
			var getTableBodies = function(tableEl)
			{
				var parentEl = tableEl.parentNode
				while (parentEl.nodename !="Table")
				{
					ParentEl = parentEl.parentNode
					if ( parentEl.nodename == "Body") return null			
				}
				return parentEl.tBodies
			}
 
	this.sortColumn = function(clickedCol)
	{
		var tableBodyEls = getTableBodies(clickedCol)
		if (tableBodyEls && tableBodyEls[0].rows.length <=1) return
		var columnData = new Array(tableBodyEls[0].rows.length)
 
		for (var i = 0; i < tableBodyEls[0].rows.lenght; i++)
		{
		columnData[i] = tableBodyEls[0].rows[i].cells[clickedCol.cellIndex].firstChild.nodeValue
		}
 
		columnData.sort()
 
		for ( var i = 0; i < columnData.length; i++)
		{
			for ( var j = 0; j < tableBodyEls[0].rows.length; j++)
			{
				if (columnData[i] == tableBodyEls[0].row[j].cells[clickedCol.cellIndex].firstChild.nodeValue)
				{
					tableBodyEls[0].appendChild(tableBodyEls[0].rows[j])
					break
				}
			}
		}
	}
}

et voici le code de ma page, c'est une page super basique utilise juste pour un test :

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
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
 
 
<style>
Th {color:red;cursor:pointer;text-decoration:underline;}
</style>
<script language="javascript" src="TableSorter.js"></script>
<script language="javascript">
var ts = new TableSorter()
</script>
 
</head>
 
<body>
 
 
<Table border="1">
<Thead>
<tr>
<Th onclick="ts.sortColumn(this)"> Title </Th>
<Th onclick="ts.sortColumn(this)"> Process Number</Th>
<Th onclick="ts.sortColumn(this)"> Owner</Th>
<Th onclick="ts.sortColumn(this)"> Status</Th>
<Th onclick="ts.sortColumn(this)"> Revision </Th>
</tr>
</Thead>
<Tbody>
      <tr> 
         <td>a</td> 
         <td>b</td> 
         <td>02</td>
		 <td>101</td> 
		 <td>bb</td>
      </tr> 
      <tr> 
         <td>d</td> 
         <td>c</td> 
         <td>04</td>
		 <td>01</td> 
		 <td>cc</td>
      </tr> 
      <tr> 
         <td>e</td> 
         <td>f</td> 
         <td>10</td>
		 <td>020</td>
		 <td>op</td> 
      </tr> 
      <tr> 
         <td>g</td> 
         <td>a</td> 
         <td>01</td>
		 <td>100</td>
		 <td>tt</td> 
      </tr> 
	     </Tbody>
   </Table> 
 
</body>
 
</html>

je suis debutant en javascript ...et la je galere un peu ....beaucoup

merci d'avance

**K_!!!** · 16/02/2006, 16h34

personne peut me filer un pt'it coup de main , svp ?

**denisC** · 16/02/2006, 16h38

Envoyé par K_!!!

" a script on this page is causing Internet Explorer to run slowly...."

une boucle infinie dans ton script

Envoyé par K_!!!

var getTableBodies = function(tableEl)
{
[...]
return parentEl.tBodies
}

Tu es sur de bien avoir recopié l'exemple? J'ai jamais vu de propriété tbodies, donc je suppose que ça vient de ton livre, mais je ne le vois pas dans ton code HTML....

**K_!!!** · 16/02/2006, 16h46

re,

merci pour ta reponse.

ben oui j'ai recopier ce code su livre, je l'ai sous les yeux la et les proprietes tbodies sont bien dans le .js mais pas dans le html... faut que je remplace Tbodies par Tbody ?

ou ca n'a rien a voir ...

pour la boucle infinie, c un peu la meme je ne sais vraiment pas comment faire pour qu'elle ne soit plus infinie cette boucle ...

probleme de script pour trier dynamiquement un tableau

JavaScript

Discussions similaires

Partager

Partager