CodeS-SourceS est hébergé par Frontier.fr

Cliquez ici pour mettre ce site au démarrage de votre navigateur

AccueilCodesTutorielsForumsEmploiLivresGuide achatConnexion

begin process at 2009 07 06 02:24:21

SILVERLIGHT 3 : COMMUNICATION ET MULTICAST par KooKiz

[PERSO] DéCOUVERTES ESTIVALES : LINUX (PART I) par FREMYCOMPANY

[REFACTORING] RESHARPER POUR VISUAL STUDIO 2010 (PREVIEW) par tja

[REFACTORING] ANALYSER VOS EXCEPTIONS AVEC RESHARPER EXCEPTIONAL par tja

SHAREPOINT 2007 : PATTERNS & PRACTICES SHAREPOINT GUIDANCE par phil

RE : BOUCLES ! par cedcyr

BOUCLES ! par cedcyr

CODE POUR EDITEUR DE TEXTE AVEC PRISE EN CHARGE DU COPIER/COLLER GARDANT LA MISE EN FORME par lolhangman

RE : COMMENT RéCUPéRER LES VARIABLES DE PLUSIEURS FORMULAIRES POUR OUVRIR FICHIER EXCEL par Bul3

+ de logiciels à télécharger

1 464 966 membres
20 nouveaux aujourd'hui
15 046 membres club

Trouver une ressource

Trouvez une ressource parmi 40 095 codes, 1 303 047 messages d'aide etc...

Recherche: dans [ Dernières recherches ]

Vous ne trouvez pas de réponse à votre problème ? Alors posez la question dans le forum. Souvenez-vous qu'il n'y a jamais de question bête, mais rester dans l'ignorance parce que l'on n'ose pas poser une question, ça c'est une erreur !

TRI DYNAMIQUE DE TABLEAU

Information sur la source

Catégorie :Divers Niveau : Débutant Date de création : 04/08/2003 Date de mise à jour : 04/08/2003 11:56:55 Vu : 9 029

Auteur : jerms

Ecrire un message privé

Note :

8,80 / 10

Commentaire sur cette source (4)

Ajouter un commentaire et/ou une note

Description

Un script pour vous permettre de trier un tableau dynamiquement sans recharger la page.
Permet de trier un tableau à plusieurs colonnes, suffit de créer un tableau pour chaque colonne.

Copier-coller et ca roule.

Source

<html><head>
<title>Tri dynamique de tableau</title>
<style>
.Titre1 { color:BA0000; font-family:'Arial'; font-weight:bold; text-decoration:underline; font-size:15pt; }
.Titre2 { color:white; background-color:BA0000; font-family:'Arial'; font-weight:bold; font-size:13pt; }
.Titre3 { color:white; background-color:BA0000; font-family:'Arial'; font-weight:bold; font-size:12pt; }
.Titre4 { color:black; background-color:E57D7D; font-family:'Arial'; font-weight:bold; font-size:11pt; }
.Corps { color:black; font-family:'Arial'; font-size:11pt; }
td { vertical-align:top; }
a { COLOR:BA0000; TEXT-DECORATION: none }
a:hover { COLOR:BA0000; TEXT-DECORATION: underline overline }
</style>
</head>
<BODY onLoad="triTab(1)">
<script langage="javascript">
var tabNum = new Array("#001","#002","#003","#004","#005","#006","#007","#008","#009","#010");
var tabNom = new Array("Dupont","Martin","Toto","Alain","Lulu","Jacques","Laurent","André","Dupond","Marcel");
var tabDesc = new Array("Homme","Femme","Homme","Autre","Femme","Autre","Homme","Femme","Femme","Homme");
function triTab(tabind) {
var temp;
var ind01;
var ind02;
var tmptab;
switch (tabind) {
case 1 :
tmptab = tabNum ;
break;
case 2 :
tmptab = tabNom ;
break;
case 3 :
tmptab = tabDesc ;
break;
}
for (ind01 = tmptab.length-1; ind01 >= 0; ind01--) {
for (ind02 = tmptab.length-1; ind02 >= 0; ind02--) {
if (tmptab[ind02] < tmptab[ind01]) {
temp = tabNum[ind02];
tabNum[ind02] = tabNum[ind01];
tabNum[ind01] = temp;
temp = tabNom[ind02];
tabNom[ind02] = tabNom[ind01];
tabNom[ind01] = temp;
temp = tabDesc[ind02];
tabDesc[ind02] = tabDesc[ind01];
tabDesc[ind01] = temp;
}
}
}
// construction du tableau
temp = "<table border='0' width='100%' class='Corps'><tr><td colspan='3' class='Titre4'>Tableau :</td></tr>";
temp += "<tr><td><a href='#top' onClick='triTab(1)'>par Num</a></td><td><a href='#top' onClick='triTab(2)'>par Nom</a></td><td><a href='#top' onClick='triTab(3)'>par Sexe</a></td></tr>"
for (ind01 = 0; ind01 < tabNum.length; ind01++) { temp += "<tr><td>" + tabNum[ind01] + "</td><td>" + tabNom[ind01] + "</td><td>" + tabDesc[ind01] + "</td></tr>"; }
temp += "</table>";
document.getElementById("tab").innerHTML = temp;
}
</script>
<center>
<a name="top"></a>
<div id="tab">&nbsp</div>
</center>
</body>
</html>

<html><head>
<title>Tri dynamique de tableau</title>
<style>
  .Titre1 { color:BA0000; font-family:'Arial'; font-weight:bold; text-decoration:underline; font-size:15pt; }
  .Titre2 { color:white; background-color:BA0000; font-family:'Arial'; font-weight:bold; font-size:13pt; }
  .Titre3 { color:white; background-color:BA0000; font-family:'Arial'; font-weight:bold; font-size:12pt; }
  .Titre4 { color:black; background-color:E57D7D; font-family:'Arial'; font-weight:bold; font-size:11pt; }
  .Corps { color:black; font-family:'Arial'; font-size:11pt; }
  td { vertical-align:top; }
  a { COLOR:BA0000; TEXT-DECORATION: none }
  a:hover { COLOR:BA0000; TEXT-DECORATION: underline overline }
</style>
</head>

<BODY onLoad="triTab(1)">
<script langage="javascript">
var tabNum = new Array("#001","#002","#003","#004","#005","#006","#007","#008","#009","#010");

var tabNom = new Array("Dupont","Martin","Toto","Alain","Lulu","Jacques","Laurent","André","Dupond","Marcel");

var tabDesc = new Array("Homme","Femme","Homme","Autre","Femme","Autre","Homme","Femme","Femme","Homme");

function triTab(tabind) {
  var temp;
  var ind01;
  var ind02;
  var tmptab;

  switch (tabind) {
  case 1 :
    tmptab = tabNum ;
    break;
  case 2 :
    tmptab = tabNom ;
    break;
  case 3 :
    tmptab = tabDesc ;
    break;
  }

  for (ind01 = tmptab.length-1; ind01 >= 0; ind01--) {
    for (ind02 = tmptab.length-1; ind02 >= 0; ind02--) {
      if (tmptab[ind02] < tmptab[ind01]) {
        temp = tabNum[ind02];
        tabNum[ind02] = tabNum[ind01];
        tabNum[ind01] = temp;
        temp = tabNom[ind02];
        tabNom[ind02] = tabNom[ind01];
        tabNom[ind01] = temp;
        temp = tabDesc[ind02];
        tabDesc[ind02] = tabDesc[ind01];
        tabDesc[ind01] = temp;
      }
    }        
  }

// construction du tableau
  temp = "<table border='0' width='100%' class='Corps'><tr><td colspan='3' class='Titre4'>Tableau :</td></tr>";
  temp += "<tr><td><a href='#top' onClick='triTab(1)'>par Num</a></td><td><a href='#top' onClick='triTab(2)'>par Nom</a></td><td><a href='#top' onClick='triTab(3)'>par Sexe</a></td></tr>"
  for (ind01 = 0; ind01 < tabNum.length; ind01++) { temp += "<tr><td>" + tabNum[ind01] + "</td><td>" + tabNom[ind01] + "</td><td>" + tabDesc[ind01] + "</td></tr>"; }
  temp += "</table>";
  document.getElementById("tab").innerHTML = temp;
}
</script>
<center>
<a name="top"></a>
<div id="tab">&nbsp</div>
</center>
</body>
</html>

Conclusion

Des questions, des remarques, .... allez-y

Sources du même auteur

CALCUL DU NUMÉRO DE LA SEMAINE

ALBUM PHOTOS EN JAVASCRIPT

SUPPRIMER LA FRAME DE PUB ET LES POPUPS CHEZ IFRANCE

HORLOGE DÉCADÉCIMALE

UNE DEMI-HORLOGE À AIGUILLES ENTIÈREMENT PARAMETRABLE

Toutes les sources de jerms

Sources de la même categorie

AFFICHE SOBREMENT LES TWEET (SELON RECHERCHE) par islacoul12

CHECKUSERACTIVITY : DETECTER L'INACTIVITÉ DU VISITEUR par kankrelune

CRYPTOR - PROTEGEZ VOS CODES SOURCES ! par amrounix

QUERYSELECTORALL par Kimjoa

CODE UTF-8 par amrounix

Toutes les sources de la catégorie Divers

Commentaires et avis

Commentaire de cctiger le 18/08/2003 10:00:40

Ce petit script est pas mal du tout en revanche j'aurais voulu savoir comment faire pour faire un tri dans l'ordre inverse ???

De A à Z c'est ce qui est fait mais de Z à A comment faire ???

Merci de me répondre si kkun a une idée !!!!

cédric.larcher@tiscali.fr

Commentaire de cctiger le 18/08/2003 10:45:10

Désolé d'avoir mis ce commentaire pour rien !!!

En fait j'avais juste oublié un tit "=" qui faisait planté mon code :)))

J'ai donc la solution :))))

Commentaire de francktfr le 18/08/2003 10:54:22

ca va, pas trop dur de pomper le code des autres:
http://www.javascriptfr.com/article.aspx?ID=146

cctiger :
Pour inverser le tri c'est facile, je vais mettre une source aujourd'hui ...

Commentaire de jerms le 25/08/2003 16:48:40

En regardant les 2 sources on voit bien que ce n'est pas du pomper, mais inspiré, si j'avais changer les variables personnes n'aurait rien vu.

Et si ma source était exactement la même que l'autre je ne l'aurai pas mise. Par ailleurs si tu veux t'amuser à réinventer la roue a chaque nouvelle source, bonne chance ;)

Mais je ne cache pas que cela m'a servie de base, et à ce que je sache, les codes sont pour s'en servir ?
A+
jerm's