Valid XHTML 1.0!                  

 

  Projet de programmation
  en Master professionnel CCI
  année 2008/2009
 
      Tris dynamiques de tableaux en javascript

 

Présentation du projet


 

Résumé :


 
Le but du projet est de permettre à l'utilisateur de trier les tableaux de données et de résultats qu'il voit à l'écran sans avoir à recharger la page mais seulement en cliquant sur l'en-tête de ligne ou de colonne, comme cela se fait dans beaucoup de logiciels et d'applications. Il faudra prévoir, à l'aide de paramètres bien choisis :
-     le tri de données numériquess comme des ages, des sommes en euros (avec décimales) ;
-     le tri de données caractères comme des noms de personne, des noms de mois, des mots-clés ;
-     le tri de toutes les lignes à partir d'une colonne de référence servant de critère de tri ;
-     le tri de toutes les colonnes à partir d'une ligne de référence servant de critère de tri.

Le tri sera implémenté javascript et devra être facilement utilisable et incorporable dans n'importe quelle page web XHTML ou PHP via un style CSS. On écrira également une page d'aide (un mode d'emploi) en français et en anglais pour rappeler l'utilisation des paramètres de la fonction.

On pourra s'inspirer (en simplifiant) des deux librairies : sortable-table et sorttable.

 

Détail du projet:
 

Un tableau qui comporte des lignes et des colonnes, souvent nommés à l'aide d'en-têtes de lignes et de colonnes, comme dans le tableau suivant :

Mois AngersNantes Tours
01 Janvier 635,12350,21550,11
02 Février 217,54310,15150,84
03 Mars 710,45400,00300,57
04 Avril 750,12380,15850,66
05 Juin 680,28395,12500,58

Une fois la page chargée, si l'utilisateur clique sur le mot Angers qui est le nom de la colonne, tout le tableau devra être trié par valeur croissante de la colonne Angers, soit le tableau :

Mois AngersNantesTours
02 Février 217,54310,15150,84
01 Janvier 635,12350,21550,11
05 Juin 680,28395,12500,58
03 Mars 710,45400,00550,11
04 Avril 750,12380,15850,66

Si l'utilisateur clique une deuxième fois sur le mot Angers alors tout le tableau devra être trié mais par valeur décroissante de la colonne Angers cette fois, soit le tableau :

Mois AngersNantesTours
04 Avril 750,12380,15850,66
03 Mars 710,45400,00550,11
05 Juin 680,28395,12500,58
01 Janvier 635,12350,21550,11
02 Février 217,54310,15150,84

Pour revenir au tableau original (qui est trié par ordre croissant de mois), il suffira de cliquer -- mais vous l'aviez deviné -- une fois sur le mot Mois.

Si maintenant l'utilisateur veut trier les colonnes pour comparer les résultats par mois, il pourra cliquer sur chacun des mois. Voici ce qu'on doit obtenir s'il clique la première fois sur la case 03 Mars

Mois NantesAngersTours
01 Janvier 350,21635,12550,11
02 Février 310,15217,54150,84
03 Mars 400,00710,45300,57
04 Avril 380,15750,12850,66
05 Juin 395,12680,28500,58

et s'il clique une deuxième fois sur le mot 03 Mars, voici ce qu'on doit obtenir :

Mois Tours AngersNantes
01 Janvier 550,11 635,12350,21
02 Février 150,84 217,54310,15
03 Mars 300,57 710,45400,00
04 Avril 850,66 750,12380,15
05 Juin 500,58 680,28395,12

Exemples de tableaux qui devront pouvoir être triés :


 

Caractéristiques de protéines

Acc. # Name pI MW (g/mol) fold index gravy
  1710351A  abscisic acid responsive protein A.    8.19      12217.13     -0.162     -1.278  
  1710351B  abscisic acid responsive protein B.   10.22      15570.27     -0.154     -1.152  
  1710351D  abscisic acid responsive protein D.    5.89      16271.11      0.252      0.075  
  AAA34172  le25.   10.02      9259.61     -0.133     -1.065  
  AAC14177  ABA stress ripening protein    6.14      16372.98     -0.233     -1.286  
  AAC17827  similar to LEA proteins    4.34      9713.92     -0.151     -1.059  
  AAC61783  LEA protein    6.05      67887.34     -0.023     -0.816  
  AAD28175  putative dehydrin    6.97      26920.29     -0.268     -1.621  
  AAF60172  dehydrin-like protein    7.72      14090.29     -0.245     -1.573  
  AAG15417  seed maturation protein   10.01      16771.79     -0.089     -0.970  
  AAW59174  dehydrin 2    8.70      15237.67     -0.180     -1.341  
  AAW59176  dehydrin 2    9.31      15294.71     -0.202     -1.387  
  AAX14177  dehydrin 4    9.24      22291.51     -0.099     -1.071  
  AAX14179  dehydrin 4    9.24      22218.45     -0.088     -1.036  
  ABB54917  dehydrin 1    9.59      14024.71     -0.291     -1.573  
  ABF94178  LEA protein, expressed    8.84      41865.51     -0.086     -1.043  
  ABX89317  group 1 LEA protein    6.67      19716.38     -0.200     -1.410  
  ACB41781  dehydrin    4.94      27073.33     -0.289     -1.431  
  BAA11017  LEA protein in group 3    5.15      48541.10     -0.104     -1.037  
  BAE92617  PvLEA2 protein    6.44      20667.88     -0.155     -1.263  
  CAA51701  Em protein    5.23      9988.11     -0.205     -1.372  
  CAC80717  putative dehydrin    7.65      25020.53     -0.078     -1.032  
  EAW15175  LEA domain protein    4.11     159774.87     -0.134     -0.865  
  NP_172994  unknown protein    5.86      10396.72     -0.153     -1.207  
  NP_173674  unknown protein    8.93      42534.43      0.167     -0.190  
  NP_175678  LEA protein, putative / LEA protein,[...]    7.49      18103.15     -0.166     -1.317  
  NP_175843  dehydrin family protein    6.79      10797.17     -0.357     -1.868  
  NP_177355  LEA domain-containing protein / LEA [...]    8.57      52710.50      0.091     -0.460  
  NP_181784  LEA domain-containing protein / LEA [...]    5.67      67204.77     -0.086     -0.978  

Compositions en acides aminés

Acc. # G    D    E    R    K    A    L    I    V    S    T    C    M    F    W    Y    N    Q    P    H   
  1710351A 16.2   2.6   11.1   2.6   12.0   7.7   5.1   1.7   1.7   9.4   6.8   0.9   1.7   0.0   0.0   0.9   0.9   6.0   6.0   6.8  
  1710351B 27.7   3.2   4.5   3.9   7.7   6.5   3.2   2.6   0.6   6.5   8.4   0.0   3.2   0.6   0.0   1.9   0.6   9.7   1.9   7.1  
  1710351D 7.9   7.3   5.3   2.0   9.3   6.6   9.9   8.6   10.6   6.6   3.3   0.7   3.3   2.0   0.0   2.6   4.6   0.7   6.6   2.0  
  AAA34172 10.2   4.5   9.1   4.5   13.6   20.5   1.1   0.0   2.3   1.1   14.8   0.0   5.7   1.1   0.0   1.1   2.3   4.5   1.1   2.3  
  AAC14177 8.4   3.5   18.2   2.8   11.2   12.6   2.8   2.8   4.2   2.1   4.2   0.0   1.4   2.8   0.0   4.2   0.0   0.0   2.1   16.8  
  AAC17827 15.2   9.8   7.6   2.2   8.7   6.5   6.5   2.2   3.3   5.4   7.6   0.0   3.3   0.0   0.0   4.3   3.3   5.4   7.6   1.1  
  AAC61783 11.5   3.0   13.4   5.6   9.5   14.6   3.6   3.1   6.8   5.8   8.1   0.2   1.4   0.9   0.3   1.4   2.0   4.7   2.0   2.2  
  AAD28175 13.5   5.3   13.5   1.6   16.3   4.1   5.7   1.6   1.6   7.3   4.1   0.8   1.6   0.8   0.0   1.2   1.2   6.1   5.3   8.2  
  AAF60172 19.8   3.8   11.5   5.3   9.9   1.5   3.1   3.1   2.3   7.6   6.1   0.0   2.3   0.0   0.0   1.5   0.8   5.3   6.1   9.9  
  AAG15417 17.6   1.8   6.1   3.0   7.9   14.5   0.6   2.4   1.8   4.2   13.9   0.0   4.2   0.6   0.0   2.4   4.2   6.7   3.0   4.8  
  AAW59174 14.7   4.2   8.4   2.1   11.2   6.3   5.6   0.7   3.5   9.1   6.3   0.0   0.0   1.4   0.0   2.1   2.1   7.0   6.3   9.1  
  AAW59176 14.0   4.2   8.4   2.8   11.2   7.0   5.6   0.7   2.8   9.8   5.6   0.0   0.0   1.4   0.0   2.1   2.1   7.0   6.3   9.1  
  AAX14177 29.7   3.2   3.6   2.7   5.0   4.5   1.4   2.3   1.8   3.6   13.5   0.0   5.0   0.0   0.0   4.5   0.9   9.5   1.8   7.2  
  AAX14179 29.7   3.2   3.6   2.7   5.0   5.4   1.4   2.3   1.8   3.6   13.1   0.0   5.0   0.0   0.0   4.5   0.5   9.5   1.8   7.2  
  ABB54917 19.7   6.1   13.6   0.8   23.5   0.8   7.6   3.8   0.8   8.3   2.3   1.5   0.0   0.0   0.0   0.0   0.0   3.8   3.8   3.8  
  ABF94178 7.0   6.2   13.0   4.8   15.0   26.5   3.0   0.5   3.8   5.2   5.8   0.0   0.2   0.2   1.5   0.5   0.2   3.5   0.2   2.8  
  ABX89317 23.1   0.5   13.2   7.1   6.0   8.2   5.5   0.5   1.1   1.6   2.7   0.0   4.9   0.0   0.0   4.4   0.0   17.6   0.5   2.7  
  ACB41781 6.2   4.6   21.2   0.8   16.2   5.8   3.3   2.9   5.4   7.1   3.3   1.7   0.4   2.5   0.0   1.2   0.4   3.3   7.1   6.2  
  BAA11017 7.1   7.8   13.4   3.8   15.0   15.2   2.5   1.8   7.4   4.0   9.8   0.0   2.0   0.9   0.0   3.1   1.6   2.2   1.3   1.1  
  BAE92617 2.8   8.9   13.9   1.7   20.6   12.2   2.8   6.1   3.9   2.2   6.1   0.0   2.8   1.1   0.6   4.4   3.9   2.2   2.2   1.7  
  CAA51701 18.3   4.3   15.1   10.8   6.5   6.5   4.3   2.2   2.2   9.7   5.4   0.0   3.2   1.1   0.0   1.1   2.2   5.4   1.1   1.1  
  CAC80717 25.0   3.7   5.7   4.9   4.5   3.3   3.3   2.5   2.9   7.0   13.5   0.0   2.0   1.2   0.0   4.9   2.0   6.6   2.9   4.1  
  EAW15175 10.3   11.9   11.5   3.2   9.3   10.9   7.2   3.8   6.4   4.5   4.2   0.3   0.5   0.9   0.4   0.6   2.6   4.5   6.3   0.8  
  NP_172994 7.3   6.2   7.3   1.0   10.4   7.3   3.1   3.1   5.2   10.4   2.1   1.0   3.1   2.1   0.0   1.0   13.5   6.2   6.2   3.1  
  NP_173674 8.1   4.7   8.3   7.0   7.5   7.3   9.4   3.6   11.9   7.5   7.0   1.3   2.3   2.6   1.0   2.3   1.8   2.6   1.6   2.1  
  NP_175678 8.3   4.1   10.7   3.0   11.8   14.2   1.8   1.2   1.8   7.1   16.0   0.0   3.6   0.0   0.0   1.8   1.2   10.1   0.6   3.0  
  NP_175843 15.3   12.2   12.2   0.0   22.4   2.0   2.0   6.1   2.0   9.2   0.0   0.0   1.0   0.0   0.0   0.0   2.0   0.0   0.0   13.3  
  NP_177355 6.0   4.6   9.0   5.8   8.5   12.3   6.7   2.1   10.2   7.5   7.1   0.8   2.1   2.7   1.2   1.7   2.3   3.3   2.1   4.0  
  NP_181784 14.5   4.1   13.5   5.7   9.4   13.9   1.4   1.4   7.6   5.7   6.0   0.0   2.4   1.3   0.2   3.1   1.1   4.6   1.3   3.0  

 

Solution (projet des étudiants)

 

retour gH    Retour à la page principale de   (gH)