probleme de script pour trier dynamiquement un tableau
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 :wink:
voici le code javascript :
Code:
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:
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 :wink:
Re: probleme de script pour trier dynamiquement un tableau
Citation:
Envoyé par K_!!!
" a script on this page is causing Internet Explorer to run slowly...."
:arrow: une boucle infinie dans ton script
Citation:
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....