Trois Listes deroulante liées

**NoSmoking** · 29/03/2018, 14h26

...mais je n'arrive pas à l'afficher?

afficher quand et où ?

**apdf1** · 29/03/2018, 14h32

quand je remplis mon tableau DATA_PAYS et que je recherche une ville les infos que je viens de mettre ne s'affiche pas à l’écran.

**NoSmoking** · 29/03/2018, 16h37

J'ai mis un nouvel exemple qui tiens compte de ton besoin (du moment), je t'engage à regarder la source pour voir où est intégrer la demande d'affichage.
L'appel de la fonction ce fait dans le case "liste-pays":.
• Listes liées avec liens v.2.

**Beginner.** · 29/03/2018, 17h54

Envoyé par NoSmoking

L'appel de la fonction ce fait dans le case "liste-pays":.

C'est "se" je pense, je dis ça car tu avais fait un rappel... Comme ça on va réviser aussi le français...

**NoSmoking** · 29/03/2018, 18h53

Envoyé par Beginner.

C'est "se" je pense, je dis ça car tu avais fait un rappel...

Excellent

**apdf1** · 30/03/2018, 08h48

Salut NoSmoking

Je vois que l'ont s'approche. J'ai voulu ajouter le N° se département à Bordeaux j'ai fait ceci dans la case "liste-pays"

Code :

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

valeur= updateSelect( "liste-villes", liste, "lien", "ville_nom","dep_code");

et dans "data_pays"

Code :

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

{"ville_nom":"Bordeaux",  "dep_code": 33, "pays_code":"FRA", "lien":"pb=!1m18!

sa ne fonctionne pas pourquoi ?

Merci

**NoSmoking** · 30/03/2018, 10h08

N'ayant pas une vision global de ton projet j'avance pas à pas en essayant de décoder ce que tu souhaites faire.

J'en conclue que tu cherches à afficher les données du département de la ville que tu viens de sélectionner.

Petit rappel au préalable :

Code :

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

1
2
3
4
5
6
7
8
9
/**
* Fonction d'ajout des <option> à un <select>
* @param   {String} id_select - ID du <select> à mettre à jour
* @param   {Array}  liste - Tableau contenant les données à ajouter
* @param   {String} valeur - Champ pris en compte pour la value de l'<option>
* @param   {String} texte - Champ pris en compte pour le texte affiché de l'<option>
* @returns {String} Valeur sélectionnée du <select> pour chainage
*/
function updateSelect( id_select, liste, valeur, texte){

cette fonction ne prend que quatre arguments donc le cinquième que tu passes est ignoré.

Dans ce cas, lorsque tu initialises le <select> des villes il te faut passer en arguments

Code :

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

valeur= updateSelect( "liste-villes", liste, "ville_nom", "ville_nom");

pour obtenir un code HTML du style

Code html :

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

1
2
3
4
5
6
7
8
<select id="liste-villes">
  <option value="">Choisir</option>
  <option value="Bordeaux">Bordeaux</option>
  <option value="Grenoble">Grenoble</option>
  <option value="Lyon">Lyon</option>
  <option value="Marseille">Marseille</option>
  <option value="Paris">Paris</option>
</select>

ensuite dans le case case "liste-villes": il te faut récupérer les informations concernant la ville choisie avec ce code

Code :

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

var infos = getDataFromTable( "ville_nom=" +valeur, data_villes);

dans ce cas infos[0] contiendra les informations liées à la ville choisie, exemple de résultat pour Bordeaux

Code :

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

1
2
3
4
5
6
{
  "ville_nom": "Bordeaux",
  "dep_code": "33",
  "pays_code": "FRA",
  "lien": "pb=!1m18!1m12!1m3!1d90493.58959818837!2d-0.6561807083778035!3d44.86382822001264!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0xd5527e8f751ca81%3A0x796386037b397a89!2sBordeaux!5e0!3m2!1sfr!2sfr!4v1520083377220"
}

pour finir il te suffit d'utiliser le résultat.

Nota : Regarde à quoi ressemble le dernier fichier data_pays.js que j'ai mis, j'ai ajouté les données départements dans la variable tbl_departement au cas où !

**apdf1** · 30/03/2018, 10h46

Re,

J'ai essayé de suivre ta consigne,
j'ai mis.

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
       //========================
       // ici on a choisi le pays
       //========================
       var info = getDataFromTable( "pays_code=" +valeur, data_pays);
       showInfoPays( info);
      // récup. des données
      liste = getDataFromTable( "pays_code=" +valeur, data_villes);
      // mise à jour du select
		   valeur= updateSelect( "liste-villes", liste, "lien", "ville_nom","ville_nom");
   //   valeur= updateSelect( "liste-villes", liste, "lien", "ville_nom");
      // chainage sur le select lié
      chainSelect("liste-villes");
      break;
    case "liste-villes":
		  var infos = getDataFromTable( "ville_nom=" +valeur, data_villes);
      // action finale
      if( valeur){
        valeur = "https://www.google.com/maps/embed?" +valeur;
        document.querySelector("#msg-wait").style.display = "block";
      }
      // affichage
      document.querySelector("#carte").src = valeur;
      break;

Alors j'affiche pas les données "dep_code": "33", du département de la ville ex: Bordeaux que je viens de sélectionner

Peut-être que j'ai zapé quelque chose?

Max

**NoSmoking** · 03/04/2018, 12h23

Peut-être que j'ai zapé quelque chose?

dans le code que tu fournis on voie bien que tu récupères les données associées à la ville mais aucune demande d'affichage !

Dans un premier temps tu as fait

Code :

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

1
2
3
4
5
//========================
// ici on a choisi le pays
//========================
var info = getDataFromTable( "pays_code=" +valeur, data_pays);
showInfoPays( info);

il te faut donc faire la même chose une fois la ville choisie.

**apdf1** · 04/04/2018, 04h25

Salut NoSomking,

Bon là j’abandonne! sa devient trop compliqué et trop long je laisse la place à un autre.

Merci @+

Max

**NoSmoking** · 04/04/2018, 14h05

C'est bien dommage, le plus dur me semble avoir était fait !

Il faut simplement faire preuve de méthode/logique pour récupérer les données dans chacune des « tables ».
Une fois ces données récupérées l'affichage ne sera que formalités et dépendra de tes propres besoins.

Une approche de ce que cela pourrait donner :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
case "liste-villes":
  // récup. données de la ville
  infoVille = getDataFromTable("ville_nom=" + valeur, data_villes);
  // affichage des données
  showInfo(infoVille, "info-ville");
  // récup. du département
  var refDepartement = infoVille[0] ? infoVille[0]["dep_code"] : "";
  // récup. données du département
  infoDepartement = getDataFromTable("dep_code=" + refDepartement, tbl_departement);
  // affichage des données
  showInfo(infoDepartement, "info-departement");
  break;

c'est pour le principe.

**apdf1** · 04/04/2018, 14h30

Re,

Je te remercie sa servira certainement à quelqu'un.

A un de cet jour bonne journée

Max

**NoSmoking** · 04/04/2018, 18h47

Je te mets quand même une v.3 qui tiens compte de ce que je t'ai mis plus haut.
• Listes liées avec liens v.3.

A toi de voir !
Bonne continuation quoiqu'il arrive

**apdf1** · 05/04/2018, 09h42

Salut NoSmoking

Voilà exactement ce que je voulait. Je vois que tu récupère les codes de data_pays tels que "pays_code, pays_nom, D_33 ou R_72 ect..."
Deux choses: Est-il possible de changer pays_code, pays_nom, D_33 ou R_72 par Code Pays, Nom du Pays, 33, Insee 72.
et supprimer l'affichage de Lien: pb=!1m18!1m12!1m3!1d90493.58959818837!2d-0.6561807083778035!3d44.86.....

Voilà je te remercie et te souhaite une bonne journée

Max

**NoSmoking** · 06/04/2018, 15h21

Voilà exactement ce que je voulait.

Voilà une nouvelle qu'elle est bonne

Deux choses: Est-il possible de changer pays_code, pays_nom, D_33 ou R_72 par Code Pays, Nom du Pays, 33, Insee 72.

Tu fais ce que tu veux dans ton script, en interrogeant les différentes « bases » tu récupères des données tu n'as plus qu'à les mettre en forme.
L'exemple que j'ai mis est très succinct et minimaliste et la routine d'affichage est des plus simple, affichage de toutes les clés et valeurs de l'objet lu.

Pour continuer ton projet je pense qu'il faut que tu reviennes au début, et n'afficher que lorsque tu as fait le choix de la ville, donc retour à un simple

Code :

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

1
2
3
4
case "liste-villes":
// affichage des informations
showInfos( valeur);
break;

C'est dans la fonction showInfos( valeur), ou valeur est la valeur de l'option choisie, qu'il te faut lire les différentes « bases » pour récupérer les données et ne garder que ce qui t'intéresse à des fins d'édition dans ta page.

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
infoVille = getDataFromTable("ville_nom=" + valeur, data_villes);
if (infoVille[0]) {
  // récup. réfèrence du département
  ref = infoVille[0] ? infoVille[0]["dep_code"] : "";
  // récup. données du département
  infoDepartement = getDataFromTable("dep_code=" + ref, tbl_departement);
  // récup. réfèrence du pays
  ref = infoVille[0] ? infoVille[0]["pays_code"] : "";
  // récup. données du pays
  infoPays = getDataFromTable("pays_code=" + ref, data_pays);
  // construction du HTML
  // etc ...

Tu peux t'inspirer de ce que j'ai fait dans la v.3.

**apdf1** · 16/04/2018, 09h04

Bonjour NoSmoking,

Après quelque jour de vacances je me remet au travail plus fatiguer qu'au paravent Bref!

Pour continuer ton projet je pense qu'il faut que tu reviennes au début, et n'afficher que lorsque tu as fait le choix de la ville, donc retour à un simple code

Je ne demande pas mieux, mais le JavaScript et toujours une bête noir pour moi.La première des choses à faire et que sa s'affiche que lorsque je fait le choix de la ville?
Et sa se n'est pas gagné !

Bon je te souhaite une bonne journée et à plus.....

Max

Trois Listes deroulante liées

JavaScript

Discussions similaires

Partager

Partager