Précédent   Forum des professionnels en informatique > Webmasters - Développement Web > JavaScript > Bibliothèques & Frameworks > jQuery
jQuery Forum d'entraide sur le framework jQuery. Avant de poster : Tutoriels jQuery, FAQ jQuery, Tous les tutoriels JavaScript, Toutes les FAQ JavaScript
Partagez cette discussion sur d'autres réseaux sociaux : Viadeo Twitter Google Facebook Digg Delicious MySpace Yahoo
Réponse Proposer ce sujet en actualité
 
Outils de la discussion
Publicité
'
Vieux 15/01/2011, 22h21   #1
Membre habitué
 
Inscription : octobre 2005
Messages : 640
Détails du profil
Informations forums :
Inscription : octobre 2005
Messages : 640
Points : 140
Points : 140
Par défaut Optimiser ma fonction de tri d'un tableau html

Bonjour,

J'ai codé une fonction qui me permet de trier un tableau HTML. Elle me semble fonctionnelle mais très lente...
Auriez-vous des conseils pour optimiser mon code ?
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
$('th').toggle(
		function(){
			tri(this.cellIndex, sortDesc);
		},
		function(){
			tri(this.cellIndex, sortAsc);
		}
	)
 
function tri(id, fn) {
	var trs = $('tr');
	var l = trs.length;
	var i, j;
	var tr_a, tr_b;
	var a, b, temp;
	for (i=0; i<=l; i++) {
		tr_a = trs[i];
		a = $('td:eq('+id+')', trs[i]).text();
		for (j=i+1; j<l; j++){
			tr_b = trs[j];
			b = $('td:eq('+id+')', trs[j]).text();
			if ( fn(a, b) ){
				// permutation des lignes a et b
				$(tr_a).insertBefore(tr_b);
				$(tr_b).insertBefore(tr_a);			
			}
		}
	} 
}
function sortAsc(a,b){
   return a<b ;
}
function sortDesc(a,b){
   return a>b ;
}
Merci d'avance !
Tchupacabra est déconnecté   Envoyer un message privé Réponse avec citation 00
Vieux 16/01/2011, 10h41   #2
Rédacteur/Modérateur
 
Avatar de SpaceFrog
 
Homme
Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Analyste Programmeur
Inscription : mars 2002
Messages : 30 007
Détails du profil
Informations personnelles :
Sexe : Homme
Localisation : Royaume-Uni

Informations professionnelles :
Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Analyste Programmeur
Secteur : Industrie

Informations forums :
Inscription : mars 2002
Messages : 30 007
Points : 45 091
Points : 45 091
J'ai ceci en stock
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
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
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<style type="text/css">
input {width:100px;}
td {border: solid 1px black;
 
    width :80px;
    }
table {border-collapse: collapse;}
</style>
<title>Table sorter</title>
<script type='text/javascript'>
 
function DESC(a,b)
{
a=a[1]
b=b[1]
if(a > b)
      return -1
   if(a < b)
      return 1
   return 0
} 
 
function ASC(a,b){
a=a[1]
b=b[1]
if(a > b)
      return 1
   if(a < b)
      return -1
   return 0
 }
 
 
 
 
function sortTable(tid, col, ord){
mybody=document.getElementById(tid).getElementsByTagName('tbody')[0]
lines=mybody.getElementsByTagName('tr')
var sorter=new Array()
sorter.length=0
var i=-1;
while(lines[++i]){
sorter.push([lines[i],lines[i].getElementsByTagName('td')[col].innerHTML])
}
sorter.sort(ord)
j=-1
while(sorter[++j]){
mybody.appendChild(sorter[j][0])
}
 
}
</script>
</head>
 
<body>
<table id="matable">
	<tr>
		<td>a</td>
		<td>r</td>
	</tr>
	<tr>
		<td>b</td>
		<td>i</td>
	</tr>
	<tr>
		<td>c</td>
		<td>v</td>
	</tr>
	<tr>
		<td>d</td>
		<td>b</td>
	</tr>
	<tr>
		<td>e</td>
		<td>o</td>
	</tr>
	<tr>
		<td>f</td>
		<td>z</td>
	</tr>
		<tr>
		<td>1</td>
		<td>23</td>
	</tr>
		<tr>
		<td>10</td>
		<td>24</td>
	</tr>
		<tr>
		<td>2</td>
		<td>25</td>
	</tr>
 
	</table>	
	Alphabétique<br/>
	colonne 1<br/>
	<input type="button" onclick="sortTable('matable',0,DESC)" value="tri desc col 1" />
	<input type="button" onclick="sortTable('matable',0,ASC)" value="tri asc col1" /><br/>
	colonne 2<br/>
	<input type="button" onclick="sortTable('matable',1,DESC)" value="tri desc col2" />
	<input type="button" onclick="sortTable('matable',1,ASC)" value="tri asc col2" /><br/>
	<br/>
 
 
 
</body>
 
</html>
tu peux t'en inspirer pour le jqueriser ...
attention toutefois je n'y ai pas intégré le tri numérique

sinon il exite un addon jquey tablesort
__________________
Ma page Developpez
Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts)
Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir...
Votre post est résolu ? Alors n'oubliez pas le Tag


réalisations :www.planet-languages.com|www.saftair.com| www.ouestisol.fr | www.sebemex.fr | www.extramiante.fr | www.sistac-alizay.fr | www.acoustishop.fr | www.litt.fr | www.ouestventil.fr
SpaceFrog est déconnecté   Envoyer un message privé Réponse avec citation 00
Vieux 16/01/2011, 19h47   #3
Membre habitué
 
Inscription : octobre 2005
Messages : 640
Détails du profil
Informations forums :
Inscription : octobre 2005
Messages : 640
Points : 140
Points : 140
trop bien !

2/3 ridicules changements... sinon pour mes besoins, pas de plugin et pas de "jQuerysation".
Je passe de 1500ms à 25ms pour le tri d'une colonne sur un tableau de 50 lignes x 7 colonnes !

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
function sortTextAsc(a,b){
	if(a[1] > b[1]) return 1;
	if(a[1] < b[1]) return -1;
	return 0;
}
function sortTextDesc(a,b){
	if(a[1] > b[1]) return -1;
	if(a[1] < b[1]) return 1;
	return 0;
}
function sortNumberAsc(a,b){
	if(parseInt(a[1]) > parseInt(b[1])) return 1;
	if(parseInt(a[1]) < parseInt(b[1])) return -1;
	return 0;
}
function sortNumberDesc(a,b){
	if(parseInt(a[1]) > parseInt(b[1])) return -1;
	if(parseInt(a[1]) < parseInt(b[1])) return 1;
	return 0;
}
function tri(tid, col, fn){
	var mybody = document.getElementById(tid).getElementsByTagName('tbody')[0];
	var lines = mybody.getElementsByTagName('tr');
	var sorter = new Array();
	var i = -1;
	while(lines[++i]){
		sorter.push( [ lines[i], lines[i].getElementsByTagName('td')[col].textContent ] );
	}
	sorter.sort(fn);
	var j=-1;
	while(sorter[++j]){
		mybody.appendChild(sorter[j][0]);
	}
}
Merci SpaceFrog !
Tchupacabra est déconnecté   Envoyer un message privé Réponse avec citation 00
Vieux 16/01/2011, 19h57   #4
Rédacteur/Modérateur
 
Avatar de SpaceFrog
 
Homme
Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Analyste Programmeur
Inscription : mars 2002
Messages : 30 007
Détails du profil
Informations personnelles :
Sexe : Homme
Localisation : Royaume-Uni

Informations professionnelles :
Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Analyste Programmeur
Secteur : Industrie

Informations forums :
Inscription : mars 2002
Messages : 30 007
Points : 45 091
Points : 45 091
il y a encore moyen d'augmenter la rapidité si le contenu des td ne change pas, il suffit en effet de renseigner l'array sorter une seule fois au chargement de la page.
__________________
Ma page Developpez
Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts)
Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir...
Votre post est résolu ? Alors n'oubliez pas le Tag


réalisations :www.planet-languages.com|www.saftair.com| www.ouestisol.fr | www.sebemex.fr | www.extramiante.fr | www.sistac-alizay.fr | www.acoustishop.fr | www.litt.fr | www.ouestventil.fr
SpaceFrog est déconnecté   Envoyer un message privé Réponse avec citation 00
Vieux 16/01/2011, 21h40   #5
Membre habitué
 
Inscription : octobre 2005
Messages : 640
Détails du profil
Informations forums :
Inscription : octobre 2005
Messages : 640
Points : 140
Points : 140
merci pour le conseil...
Tchupacabra est déconnecté   Envoyer un message privé Réponse avec citation 00
Réponse Proposer ce sujet en actualité Cette discussion est résolue.
Outils de la discussion



Fuseau horaire GMT +2. Il est actuellement 01h42.


 
 
 
 
Partenaires

Hébergement Web