Le tri d'un tableau qui contient des input text

**haylox** · 11/03/2013, 23h57

Salut j'ai un exercice qui demande la création d'un tableau en permettant l’utilisateur de préciser le nombre de colonnes et lignes , et de mettre des input dedans pour permettre la modification du contenu de chaque colonne.et aussi de créer un button pour le trie des valeurs du tableau... j'ai rencontré un problème avec le trie , l'idée que j'ai essayer de faire c'est de transformer le tableau (2 dimension) en un tableau à une dimension puis le trier et de le transformer en matrice (la méthode marche aussi si le tableau a une seule dimension) mais la fonction de trie ne marche pas comme il faut , voici le code:

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
 
<html>
<head>
<script type="text/javascript"> 
<!--
 function Table() {
 var l=document.F1.lg.value;
var c=document.F1.cl.value;
var i;
var j; 
 
 
for(i=1;i<=l;i++){
		var line=document.createElement("tr");
		for(j=1;j<=c;j++){var cel=document.createElement("td");
							var zt=document.createElement("input");
								zt.type="text";
								zt.id="z"+i+j;
								zt.size=3;
								cel.appendChild(zt);
								line.appendChild(cel)
							                         }
						  document.getElementById("tb1").appendChild(line);
 
						  }
}
 
function GetColumn() {var c=document.F1.cl.value; return c;}
function GetLine() {var s=document.F1.lg.value; return s;}
function Trie() {var a=0;
                 var tab = new Array();
				 var i=0;
				 var j=0;
				 var k=0;
				 var col=GetColumn()
				 var lin=GetLine()
				 for (k=1;k<=lin;k++)
				 { for (j=1;j<=col;j++)
				 {var ch="z"+k+j;
 
				 tab[a]=document.getElementById(ch).value;
 
				  a+=1;}
				 }
			     for (i=0;i<tab.length-1;i++)
				 {
				 for(j=1;j<tab.length;j++)
				 {
				 if (tab[i]>tab[j])
				 {
				 var x=tab[i];
				 tab[i]=tab[j];
				 tab[j]=x;
				  }
				 }
				 }
                 var w=0;
                 for (k=1;k<=lin;k++)
				 { for (j=1;j<=col;j++){
				 var yn="z"+k+j;
				 var changer=document.getElementById(yn);
 
				 changer.value=tab[w];
				 w+=1;
				 }
				 }
				 }
 
 
 
-->
</script>
</head>
<body >
<Form name="F1">
Tracer une table:<br>
Donner le nombre de lignes:<input type="text" size="2" maxlength="2" name="lg" defaultValue="2"> <br>
Donner le nombre de colonnes:<input type="text" size="2" maxlength="2" name="cl" defaultValue="2"> <br>
Donner la couleur du contour:<SELECT NAME="list"> 
<OPTION VALUE="1">Rouge
<OPTION VALUE="2">Vert 
<OPTION VALUE="3">bleu 
</SELECT>
<input type="button"  name="Tr" value="Tracer" onClick="Table()"><br>
 
<input type="button"  name="Bt1" value="Trier" onClick="Trie()"><br>
 
 
</Form>
<Table id="tb1" border=1  ></Table>
</body>
</html>

**Kaamo** · 13/03/2013, 09h56

Salut !

C'est un beau "fouillis", je pense que tu y gagnerais à mieux indenter, organiser, renommer, coder sous les bonnes conventions ton code.

Dans l'idée, j'aurais plutôt dissocié le fait de construire les données de les dessiner.
- Faire un tableau javascript qui stocke les valeurs des input
- Faire une fonction permettant de dessiner une table html en agrémentant les input des données préalablement renseignées
- Faire une fonction de tri simplement directement sur le tableau javascript. Ta fonction qui dessine le tableau est ensuite réutilisée

Pour le tri, j'en vois plusieurs différents. Par ligne ? Par colonne ? Ascendant ? Descendant ?
j'ai rien compris à :

j'ai rencontré un problème avec le trie , l'idée que j'ai essayer de faire c'est de transformer le tableau (2 dimension) en un tableau à une dimension puis le trier et de le transformer en matrice

**haylox** · 17/03/2013, 12h47

Le problème que j'ai c'est que j'ai pas précisé le type des données du tableau , il a trier le tableau qui contient des chiffres numérique , en tant que caractères... j'ai remplacé le blog dans la fonction concernant le trie avec la fonction :

Code :

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

1
2
3
4
5
6
7
8
for (i=0;i<tab.length;i++){
 for(j=i+1;j<tab.length-1;j++){
 if (tab[i]>tab[j])
 {var x=tab[i];
  tab[i]=tab[j];
  tab[j]=x;}
 }
 }

avec ça :

Code :

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

1
2
3
4
function sortfunction(a, b){
return (a - b) //causes an array to be sorted numerically and ascending
}
Tab.sort(sortfunction)

je vais le marqué comme résolu!

Le tri d'un tableau qui contient des input text

JavaScript

Discussions similaires

Partager

Partager