Page 1 sur 1

Trier par ordre alphabetique

Posté : 18 août 2017, 07:01
par maval
Bonjour à tous,

Voilà je cherche désespérément depuis plusieurs jours un code pour trier mon tableau texte et images (environ 500) en sachant que je puisse rajouter des textes et des images.
J’ai un code html qui est composé comme ceci :

Code : Tout sélectionner

<table id="blason" border="0" width="98%">
           
           <tr><th colspan="5" class="titre"> <h1>Département de l'Ain....</h1></th></tr>
           
           <tr><th colspan="5" class="nombre"> ....Il y a 166 blasons sur le site dans le département de l'Ain....</th></tr>
           <tr class="class1"> <!-- 2 -->	
				<td class="td_text">   ARBENT  <br>- 01 014 -</td>		
				<td class="td_text">   ARBIGNIEU  <br>- 01 015 -</td>		
				<td class="td_text">   ARGIS  <br>- 01 017 -</td>	
				<td class="td_text">   ARS SUR FORMANS  <br>- 01 021 -</td>		
				<td class="td_text">   ARTEMARE  <br>- 01 022 -</td>
			</tr>
		          <tr class="class1">						
				<td class="td_image"><a href=".html"><img src="../Blason_france/aa_blasons_transparent/ambutrix-01.png" width="95" height="120" ></a></td>
				<td class="td_image"><a href=".html"><img src="../Blason_france/aa_blasons_transparent/angles-04.png" width="95" height="120" ></a></td>
                <td class="td_image"><a href=".html"><img src="../Blason_france/aa_blasons_transparent/appenwihr-68.png" width="95" height="120" ></a></td>
				<td class="td_image"><a href=".html"><img src="../Blason_france/aa_blasons_transparent/aranc-01.png" width="95" height="120" ></a></td>
                <td class="td_image"><a href=".html"><img src="../Blason_france/aa_blasons_transparent/arbent-01.png" width="95" height="120" ></a></td>
			</tr>
			<tr class="class1"> <!-- 1 -->	
				<td class="td_text">  AMBERIEU EN BUGEY   <br>- 01 004 -</td>		
				<td class="td_text">  AMBERIEUX EN DOMBES   <br>- 01 005 -</td>		
				<td class="td_text">  AMBRONAY   <br>- 01 007 -</td>	
				<td class="td_text">  AMBUTRIX   <br>- 01 008 -</td>		
				<td class="td_text">  ARANC   <br>- 01 012 -</td>
			</tr>
		          <tr class="class1">						
				<td class="td_image"><a href=".html"><img src="../Blason_france/aa_blasons_transparent/cordelle-42.png" width="95" height="120" ></a></td>
				<td class="td_image"><a href=".html"><img src="../Blason_france/aa_blasons_transparent/fresnes_au_mont-55.png" width="95" height="120" ></a></td>
                <td class="td_image"><a href=".html"><img src="../Blason_france/aa_blasons_transparent/amberieu_en_bugey-01.png" width="95" height="120" ></a></td>
				<td class="td_image"><a href=".html"><img src="../Blason_france/aa_blasons_transparent/amberieux_en_dombes-01.png" width="95" height="120" ></a></td>
                <td class="td_image"><a href=".html"><img src="../Blason_france/aa_blasons_transparent/ambronay-01.png" width="95" height="120" ></a></td>
			</tr>
			</table>	
Ma recherche est que j’aimerai trouver un code qui affiche automatiquement par ordre alphabétique les textes ainsi que les images qui correspond au texte.

Je vous remercie de votre aide.

Cordialement
Max

Re: Trier par ordre alphabetique

Posté : 18 août 2017, 10:01
par webmaster
Bonjour,

Pour ma part, j'utilise http://tablesorter.com/docs/ un plugin jQuery tres simple et performant pour trier des tables

Re: Trier par ordre alphabetique

Posté : 18 août 2017, 11:31
par maval
Bonjour

Je te remercie je suis aller voir voir mais mon problème anglais?

Bonne journée

Re: Trier par ordre alphabetique

Posté : 18 août 2017, 15:11
par Frosty
Bonjour,

Déjà une question : ce tableau est généré comment ? les données viennent d'où ? (script PHP + base MySQL ou autre... ?)

Si par ex. c'est un script PHP, ne vaudrait-il pas mieux l'adapter pour d'abord trier les données avant leur affichage particulier tel que visible dans le HTML (avec 5 blasons par ligne) ?

Parce que là en JavaScript (côté navigateur donc) il faudrait carrément "parser" le tableau pour récupérer ses données et pouvoir en faire ce qu'on veut (tri...) et ensuite les réafficher... Ca ne me paraît pas idéal.

Autre possibilité : générer les données sous forme d'objet JSON côté serveur, ce qui permettrait de les récupérer très facilement côté navigateur ; là en JavaScript faire le tri et générer le tableau à partir des données, en faisant éventuellement intervenir le plugin proposé par le webmaster qui permet d'appliquer le tri sur la colonne qu'on veut (même si c'est en anglais, il y a juste à faire des copier-collers de la section "getting started" et inclure jQuery pour le faire fonctionner).

Re: Trier par ordre alphabetique

Posté : 19 août 2017, 04:42
par maval
Bonjour Frosty

Je te remercie d’avoir répondu, et excuse moi de ne pas avoir répondu avant.
Mes données proviennent de mon disque dur que je rentre au fur et mesure je pense que sa doit être possible de les traiter en amont ?.
En sachant qu’il ne peut pas avoir deux noms avec le même N° de département.
Cela veut dire qu'il vous est possible d'ajouter, de retirer et de modifier les données
Je pense que tu as raison de dire que l’autre possibilité est de passé par générer les données sous forme d'objet JSON côté serveur, mais le problème est que je ne suis pas capable de le coder. Je me suis rendu sur le site JQuery pour voir je n’y arrive pas !
Si tu peux m'aider je serrer reconnaissant Je ne pense pas que ce serait aussi compliquer que cela.

Je te souhaite un bon WE et te remercie d'avance.
Max

Re: Trier par ordre alphabetique

Posté : 19 août 2017, 14:57
par Frosty
Bon, si je résume, tu souhaites une application qui gère une liste de blasons :
  • Une liste de blasons avec nom de ville, département, image
  • On doit pouvoir ajouter, modifier, supprimer des blasons
  • Lors de l'ajout ou de la modification il faut empêcher qu'on se retrouve avec 2 fois le même nom de ville pour un même département
Ce qui veut dire qu'il faut un stockage de données permanent (même si c'est un simple fichier sur ton disque dur) donc une partie serveur (au moins un petit serveur Node que tu lances quand il y a besoin).

Il faut donc coder au moins deux "vues" distinctes :
  • Pour la liste des blasons (tableau avec 5 blasons par ligne... ou autre présentation pour pouvoir trier/filtrer ?)
  • Pour l'ajout / modification des blasons (formulaire)
Pour ma part, coder une telle appli de bout en bout avec un minimum de présentation graphique + tests, c'est pas que c'est compliqué mais ça me prendrait facilement une bonne demi journée, désolé mais je ne peux pas me permettre de faire ça gratuitement (je suis en indépendant, je peux te faire un devis si tu veux).

Sur n'importe quel forum de programmation, tu trouveras des gens prendre 5/10 minutes pour te conseiller, te donner des pistes, te dépanner si tu essaies de créer un script et que tu es bloqué sur une erreur précise, mais pas pour te donner des heures de travail gratuites :| (ou alors avec beaucoup de chance mais tu risques d'attendre un sacré moment)

A noter qu'il existe des logiciels qui permettent de faire ce que tu souhaites sans devoir écrire une ligne de code, mais là encore ce n'est pas gratuit.

Re: Trier par ordre alphabetique

Posté : 19 août 2017, 16:03
par maval
Re,

Je te remercie mais je ne peux pas, je fait cela pour passer mon temps car je suis cloué sur un chaise roulante avec une sclérose en plaque avec une pension de 800€ par mois.La seul chose qui me reste et mon ordinateur alors le peux de temps qui me reste je le comble avec lui.
Merci beaucoup et bonne journée

Max

Re: Trier par ordre alphabetique

Posté : 19 août 2017, 17:30
par Frosty
A tout hasard peut être que gérer les blasons avec une feuille de calcul Google Sheets pourrait faire l'affaire ?
Pas de compétence de codage requise (juste un compte Google), par contre il n'y aura pas de vérification sur les doublons, et il faut que les images soient accessibles par des URL : il est alors possible de mettre des images dans des cellules comme ceci https://www.youtube.com/watch?v=6WFdT2SX7QU (même si le tuto est en anglais il suffit de refaire les manips du monsieur visibles dans la vidéo)
Ensuite tu peux très facilement trier (même sur plusieurs colonnes) et filtrer (par ex. par département)
Tu peux publier le contenu sur internet ou partager en lecture seule à l'aide d'un lien (par contre attention, dans ces contextes, le tri et le filtrage ne sont plus possibles).

Sinon, en repartant sur la solution du fichier HTML, si tu es prêt à gérer les données en JSON à la main, voici un exemple tout simple à adapter (nécessite jQuery) : http://jsfiddle.net/8kkg3/ (issu de cette question StackOverflow, en anglais)

Bon courage.

Re: Trier par ordre alphabetique

Posté : 19 août 2017, 18:04
par maval
Re,

Je te remercie et bon WE

Max