Parse et remplissage de tableaux dynamiques

**Beginner.** · 07/11/2018, 12h46

Salut,

Envoyé par claude.aignant

Et potentiellement oui, il pourrait y avoir des catégories sans sous-categories, ou une seule, ou 2 ou 3 ou 12 etc...

Même dans ce cas cela pourrait fonctionner si par exemple quand il n'y a pas de sous-catégories on a quand même une balise <ul> qui dans ce cas serait vide...

Mais bon mon code était juste un exemple simple pour démarrer après pour ce genre de structure imbriquées c'est vrai qu'une fonction récursive est tout à fait indiquée (ce que jreaux62 a fait)... Cela ne veut pas dire qu'on ne peut pas l'éviter d'ailleurs dans le fil que j'ai mentionné (Convertir des listes à la syntaxe particulière en HTML) on a un bon exemple des deux manières de faire (récursif et non récursif)...

Mais c'est vrai que dans ce fil Parcourir un bookmark FF a un moment donné j'ai fini par utiliser une fonction récursive pour obtenir dans un premier temps un tableau contenant toutes les infos nécessaires en particulier la profondeur (deph) :

Envoyé par Beginner.

C'est déjà plus compliqué à faire, perso pour le faire j'ai dû parcourir tous les éléments du DOM dans l'ordre en enregistrant la profondeur (deph) pour chaque niveau...

Enfin je mets le code pour qu'on comprenne mieux ce que je veux dire : http://jsbin.com/nujivatoca/1/edit?js,console.
Je fais un affichage simple avec la bonne indentation permettant de voir l’arborescence mais c'est juste une string, ce n'est pas un HTML.
Je pense cependant qu'on peut obtenir un HTML ou un JSON avec le tableau arrayOfParentnodes :

Cela me fait penser au tableau obtenu par le code de jreaux62 sauf que lui a ajouter un paramètre pour le parent mais pour construire une structure genre JSON le deph est suffisant...

Envoyé par claude.aignant

Bref, le code de @jreaux62 est, clairement, diablement efficace et aboutit, mais aussi diablement plus compliqué pour moi ; je n'en saisi pas la moitié et suis très mal à l'aise de devoir l'intégrer sans le maîtriser

Oui son code est plus complexe à comprendre notamment à cause de la fonction récursive mais aussi parce que son code va plus loin (il construit automatiquement les trois listes liées) donc c'est normal qu'il soit plus long à analyser puisqu'il fait plus de chose, il est plus complet...

Il te faut séparer les différentes étapes du code (savoir qui fait quoi) et à la limite si tu ne comprends pas la fonction récursive tu peux te contenter de savoir ce qu'elle fait, ce qu'elle produit...

Envoyé par claude.aignant

Au début, je ne comprenais pas la problématique que relèvait @jreaux62 à @Beginner. au sujet de mon besoin de créer des listes liées, mais maintenant je (pense) la saisir : le code de @Beginner. lit et parse linéairement le html sans boucles imbriquées, celui de @jreaux62 bouclerait à chaque niveau de l'arborescence...

Un des avantages de la fonction récursive c'est que la profondeur de l’arborescence peut varier autant qu'on veut, elle peut être plus courte (exemple une catégorie sans sous-catégories) ou plus longue (exemple une sous-sous-catégorie ayant des sous-sous-sous-catégories).

Cela me semble être la meilleure solution...

Et les tableaux au-delà de deux dimensions cela devient franchement lourd...

**Beginner.** · 07/11/2018, 13h06

Ah oups je n'avais pas vu la réponse #40 de jreaux62, j'étais en train d'écrire la mienne et une fois postée il y a eu un changement de page du fil (passage à la troisième page)...
Je vais voir ça...

Invité · 07/11/2018, 13h17

Envoyé par Beginner.

...Même dans ce cas cela pourrait fonctionner si par exemple quand il n'y a pas de sous-catégories on a quand même une balise <ul> qui dans ce cas serait vide...

NON.
Là encore, tu IMPOSES une contrainte, "qui ne fait pas partie du cahier des charges".

Et il n'y a pas de raison qu'un "menu normalement constitué" contienne des balise <ul> vides...

**claude.aignant** · 07/11/2018, 13h28

@jreaux62 :
Merci pour ces explications détaillées, qui vont énormément m'aider, et pour le temps passé à les rédiger.
Le temps à te frotter aussi au DOM Parser, mais je reste certain que tu as déjà de bonnes prédispositions, contrairement à moi...
Toutefois me faire passer pour un tire-au-flanc qui n'a rien recherché avant de poster, pas d'accord....
J'ai cherché -ah, peut-être mal- un traitement javascript me permettant de parser simplement du html, et çà n'a pas fait echo ou trouvait les réponses compliquées à mettre en oeuvre.

Concernant la rédaction, je suis OK, j'ai beaucoup de mal à synthétiser et rendre compte simplement des choses, j'en suis désolé et preuve en est que cela me pénalise beaucoup...

Par contre, concernant :

Envoyé par jreaux62

Tu n'as pas répondu à ma question, mais j'en ai tenu compte.

La structure de ma variable les_categories permet d'ajouter facilement des catégories, sous-catégories, sous-sous-catégories !
Il suffit d'en connaitre le niveau ('lvl') et le parent ('par') :
ex. :
{ txt: "nouvelle Sous-Catégorie pour la catégorie 1", lvl: 1, par: 0 },
{ txt: "nouvelle Sous-Sous-Catégorie pour la Sous-catégorie 1.1", lvl: 2, par: 1 },

Pour "ajouter" à la variable les_categories, on utilisera .push().[*]{ txt: "Sous-Catégorie 1.1", lvl: 1, par: 0 } : "par: 0" signifie que la catégorie parente est "Catégorie 1" (index 0)

... je n'ai effectivement pas répondu à cette question, ce qui aurait levé toute incompréhension, mais comme je l'indiquais en début de fil, l'objectif de tout çà était d'alimenter un textarea en fonction des éléments présents dans ce menu (et pouvoir les y enlever en cas d'erreur d'affectation), tout comme je l'avais fait (et réussi) pour les attributs de produits.
Et donc, je ne comptais pas ajouter (simuler l'ajout...) d'options (catégories, sous-categ...) à mon menu (géré qui plus est 'ailleurs'), mais bien ajouter celles du select concerné (catégorie et/ou sous-categ et/ou sous-sous-categ) à ma liste de tags (formatés comme nécessaire ce n'est pas un problème) générés dans la textarea regroupant tous les tags du produit (criteres + catégories du menu).

Toutefois cette disposition dont tu as tenu compte, m'offre un spectre d'utilisation complémentaire : en dépis de la limite de 3 niveaux du menu, je peux offrir un degré de filtrage supplémentaire par des catégories absentes du menu (ce qui éviterait de l'alourdir, voire le simplifier :-) et donc permettre un filtrage via des sous-catégories inexistantes (ie non affichées dans le menu) mais disponibles dans les pages de résultat, ce qui est top!
La difficulté serait après de reconstruire ce menu 'fictif' lorsque je veux mettre à jour les tags d'un produit existant...

Et la fonction de ces boutons (car comme toi je trouve çà moche, j'aurai pu faire ce traitement de construction et ajout des tags/options au clic ou double clic) était précisément de ne pas être gêné lors de la sélection d'une, ou combinaison de plusieurs options de catégories, entre sélection, et regénération induite du menu/sous-menu/sous-sous-menu.
Et par la suite faire en sorte de pouvoir différencier, dans ces 3 select, celles déjà ajoutées des autres disponibles...

Du coup, en parcourant un tableau à 3 dimensions, il me semblait 'facile' de créer ces 3 selects, de sélectionner ceux qui m'intéressent pour le produit, et relancer en fin de sélection la génération des 3 select en appliquant une couleur aux options déjà présentes dans le listing de tags.

Invité · 07/11/2018, 13h37

J'ai effacé mes "commentaires désobligeants"...
Comme je l'ai dit, je mords rarement...

Envoyé par claude.aignant

...mais je reste certain que tu as déjà de bonnes prédispositions, contrairement à moi...

La seule "prédisposition" s'appelle la CURIOSITE *.

On peut aussi ajouter l'"envie d'apprendre, et de partager".

* J'ai beaucoup appris en aidant les autres sur ce forum (DVP).
C'est aussi ce qui mène à l'"expérience".

...mais bien ajouter celles du select concerné (catégorie et/ou sous-categ et/ou sous-sous-categ) à ma liste de tags...

Là, je pense que tu aurais effectivement le dire plus tôt.

En effet, le choix de <select> n'est pas forcément judicieux.

Le plus judicieux en l'occurrence serait d'utiliser des cases à cocher : <input type="checkbox"/> !
Tout en conservant une structure <ul><li> pour l'affichage.

Voilà par exemple comment WordPress gère le choix de catégories :
Nom : WP-choix-categories.jpg
Affichages : 94
Taille : 30,9 Ko

Nom : WP-choix-categories.jpg
Affichages : 94
Taille : 30,9 Ko

...La difficulté serait après de reconstruire ce menu 'fictif' lorsque je veux mettre à jour les tags d'un produit existant...

Je n'ai absolument pas compris la finalité de tout ça...

Car comme je te l'ai dis : UNE ETAPE A LA FOIS.

Par contre, si c'est destiné ensuite à être enregistré (en BDD ? ... ?), peut-être t'es-tu trompé de langage !
Une gestion "normale" devrait se faire dans un "pabel d'administration", avec un langage coté serveur, comme PHP.

Invité · 07/11/2018, 14h07

@Beginner.

1- Si le terme "bug conceptuel" ne te convient pas, on peut aussi l'appeler "erreur de conception".

Ou si tu préfères : une "simplification exagérée" (en ajoutant des "contraintes", en vue de simplifier le code)

2-

... Après si on veut chipoter ce que tu proposes pose un problème car ce <ul> dont tu parles contient deux <li> qui ne sont pas des catégories :...

Dans mon code, ça se trouve ici :

Code :

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

1
2
3
4
5
  // --------
  // on récupère les catégories, sous-catégories et sous-sous-catégories dans UN SEUL objet "les_categories"
  // SPECIAL : on NE prend PAS les 2 menus "Connexion" et "Créer un compte" (avec la classe "customer-navlink")
  var elts = doc_html.querySelectorAll('#accessibleNav > li:not(.customer-navlink)');
  les_categories = get_categories_by_level( [], elts, 0, '' );

N.B. Je ne me pose pas en "donneur de leçon"...
J'apprends aussi moi-même des réponses des autres, et c'est d'ailleurs TON code qui m'a justement permis de démarrer le mien !

**claude.aignant** · 07/11/2018, 14h33

Envoyé par jreaux62

J'ai effacé mes "commentaires désobligeants"...
Comme je l'ai dit, je mords rarement...

Merci! Après je comprends que çà puisse exaspérer..

Envoyé par jreaux62

La seule "prédisposition" s'appelle la CURIOSITE *.

Je le suis ; mais elle trouve ses limites dans les capacités des uns et des autres à appréhender un nouveau langage, avoir les bonnes bases, les bons réflexes, un esprit exercé...

Envoyé par jreaux62

Là, je pense que tu aurais effectivement le dire plus tôt.
En effet, le choix de <select> n'est pas forcément judicieux.
Le plus judicieux en l'occurrence serait d'utiliser des cases à cocher : <input type="checkbox"/> !
Tout en conservant une structure <ul><li> pour l'affichage.

En effet, çà me paraît très judicieux, je vais sérieusement y réfléchir, mais en terme d'affichage çà me paraît moyen (menu énorme....).

Envoyé par jreaux62

Je n'ai absolument pas compris la finalité de tout ça...

Cà c'est un peu dommage...
Je vais essayer d'être synthétique si çà intéresse :
- 3 niveaux -et pas plus- dans une arborescence de menu Shopify
- beaucoup de catégories, et de sous-catégories, de produits, de déclinaisons, de variantes, de critères de filtrage...
- Shopify est un joli squelette, conçu pour y greffer des fonctionnalités en fonction du porte-monnaie (et des besoins...)
- j'ai pas de sous et suis pressé
- besoin d'offrir un moyen efficace et souple pour filtrer mes produits, inexistant en natif.
- à l'affichage d'une liste de résultats (=de produits) (clic sur une categ, sous-categ etc...), j'ai intégré un dev qui choppe tous les tags des produits du listing de résultats, et va générer à la volée des select de filtrage selon les tags produit : si l'un d'eux contient les tags 'couleur_vert', 'couleur_bleu', 'matière_plastique', 'matière_bois', etc..., tous les produits vont s'afficher, mais le listing en entête présentera 2 select : 'couleur' et 'matière' qui une fois sélectionnés relanceront et filtreront la liste de résultats en fonction des critères sélectionnés.
- la solution trouvée fonctionne
- je cherche ici à créer le développement indépendant, préalable au moindre ajout de produit en boutique, permettant de générer rapidement et sans erreur la liste de tags utiles lors de ma session d'ajouts de produits.

Envoyé par jreaux62

Par contre, si c'est destiné ensuite à être enregistré (en BDD ? ... ?), peut-être t'es-tu trompé de langage !
Une gestion "normale" devrait se faire dans un "pabel d'administration", avec un langage coté serveur, comme PHP.

C'eut été idéal (et j'aurai eu moins de mal), mais non, justement, je ne maîtrise ni Shopify, ni Liquid, ni la BDD, ni la structure même de la boutique....
Je ne peux donc rien développer par moi-même dessus, à peine adapter (et encore)...
D'où ma contrainte de devoir faire un développement totalement annexe et indépendant...

Enfin, @Beginner. en effet, l'arborescence est susceptible d'évoluer, certaines sections potentiellement avec aucune sous-catégorie et d'autres avec...
Mais il est certain que c'est en 1er lieu avec ton code que j'ai pu comprendre de façon beaucoup plus claire, en quoi reposait concrètement l'utilisation du ParserDOM.
Complet ou pas complet, gérant ou pas des exceptions, j'étais déjà bien content de le trouver, de le découvrir aussi 'court', et c'était effectivement le petit coup de pouce qu'il me fallait pour mettre le pied à l'étrier.
Après, le code de @jreaux62, je dois avouer que c'était un peu le coup de massue : pas si simple finalement si on va au bout...

Bref, vous allez être déçus (je vous raconte pas mon état..), je n'ai pas encore commencé car entre autres affaires, ma voiture vient de me lâcher et évidemment je peux rien faire sans etc... etc... donc encore une priorité qui vient prendre le pas sur un projet prioritaire et sur lequel je ne cesse de prendre du retard...
Mais je suis convaincu de pouvoir parvenir au résultat attendu avec nos derniers échanges et j'ai hâte de m'y mettre sérieusement.
Et je vis mal de vous voir débattre sur mon fil alors qu'un sujet m'empêche de m'y consacrer dans l'immédiat......

**Beginner.** · 07/11/2018, 15h00

Envoyé par jreaux62

1- Si le terme "bug conceptuel" ne te convient pas, on peut aussi l'appeler "erreur de conception".
Ou si tu préfères : une "simplification exagérée" (en ajoutant des "contraintes", en vue de simplifier le code)

Lol... Même pas : c'est tout simplement un code ayant pour but d'aider à démarrer en donnant un exemple concret de deux manières de faire la première étape "parser le code HTML" avec un exemple d'utilisation des méthodes du DOM... Et en aucun cas un code destiné à répondre "au cahier des charges"... Il ne faut donc pas le juger selon ce critère mais plutôt selon son objectif...

Et il semble que cet objectif a été atteint même pour toi :

Envoyé par jreaux62

J'apprends aussi moi-même des réponses des autres, et c'est d'ailleurs TON code qui m'a permis de démarrer le mien !

Eh bien c'est déjà ça... Je ne prétends pas plus...

Envoyé par jreaux62

Dans mon code, ça se trouve ici :

Ah intéressant et instructif ! Tu l'as ajouté après ? Je demande car quand j'ai testé ton code j'avais vu ces deux <li> dans le premier <select>...

Sinon oui je préfère ton code et comme expliqué au message #41 j'ai dû moi-même faire ce genre de chose donc c'est clair que ce n'est pas moi qui serait contre...

Invité · 07/11/2018, 15h03

@Beginner.

1- Tu n'as pas besoin de "te justifier".
Je te faisait part d'une remarque sur ton code.
Pas d'une critique.

2- Quant à mon code: oui, il a évolué.

Comme je l'ai dit (et répété) : ETAPE par ETAPE !

J'ai écrit le code pour récupérer TOUTES les catégories : d'abord avec une fonction "simple"... qui devenait de plus en plus complexe à mesure qu'on descendait d'un niveau
J'ai donc modifié, pour passer par une fonction "récursive" (plus difficile à appréhender, surtout pour un débutant, mais tellement plus efficace !)
ENSUITE SEULEMENT, j'ai cherché comment "ne pas prendre" certaines catégories en compte (et j'ai vu qu'elles avaient en commun la classe "customer-navlink")

3- A croire que le "bavardage" est contagieux !!

On se met tous à écrire des kilomètres de blabla !!

Envoyé par claude.aignant

...Et je vis mal de vous voir débattre sur mon fil .....

@claude.aignant

RASSURE-TOI !
Je pense au contraire que cette discussion a été ENRICHISSANTE pour CHACUN de nous !

Pour ma part :

c'est la première fois que j'utilise DOMparser
et la 2ème fois peut-être que j'utilise une fonction récursive !

**claude.aignant** · 07/11/2018, 16h52

Bon alors, premiers essais, à pas menus, et déjà bloqué

...

L'option que je sélectionne dans mon 1er sélect est la 'Catégorie 2'.

Et donc, j'ai : le_select_1 vaut :21
1ère victoire, mon alert(le_select_1.value) fonctionne...

Etape suivante : Je comprends que pour récupérer le libellé de l'option concernée, je dois appeler une fonction en lui balançant l'indice '21', et en tirer une propriété 'txt' qui a la valeur que j'attend...

Je cherche, je lis, constate et comprends (à priori) comment ajouter une 'ligne' à les_categories...(mais j'ai pas testé)
Mais... Et en fait je ne comprends pas la structure de les_categories, je ne connais pas ce mode de remplissage de variable....

J'ai l'impression que select_options_categorie_by_level_by_parent( arr=[], lvl=0, par='' ) peut m'aider....
Elle attend un tableau, un level, un parent...

J'ai ce qui ressemble à un tableau (les_categories).
J'ai un level (21).
J'ai un parent (sauf erreur, c'est 0 car je suis sur le_select_1).

Je tente un timide (qui va en faire rire plus d'un...) :

Code :

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

alert(select_options_categorie_by_level_by_parent( les_categories, le_select_1.value, 0 ));

... mais bon

Pourtant je la vois l'info dans ma console : je veux çà {txt: "Catégorie 2", lvl: 0, par: ""}

Bref, je suis pas rendu n'est-ce-pas...

Invité · 07/11/2018, 17h29

Envoyé par claude.aignant

... Et en fait je ne comprends pas la structure de les_categories, je ne connais pas ce mode de remplissage de variable....

Ce n'est pas étonnant.
Moi-même, je ne connais cette structure que depuis très récemment.

les_categories est un array, contenant des objets.

Code :

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

1
2
3
4
5
6
7
8
9
 
0: Object { txt: "Catégorie 1", lvl: 0, par: "" }
1: Object { txt: "Sous-Catégorie 1.1", lvl: 1, par: 0 }
2: Object { txt: "Sous-Sous-Catégorie 1.1.1", lvl: 2, par: 1 }
...
21: Object { txt: "Catégorie 2", lvl: 0, par: "" }
22: Object { txt: "Sous-Catégorie 2.1", lvl: 1, par: 21 }
23: Object { txt: "Sous-Sous-Catégorie 2.1.1", lvl: 2, par: 22 }
24: Object { txt: "Sous-Sous-Catégorie 2.1.2", lvl: 2, par: 22 }

Pour afficher le libellé ('txt') de la ligne ayant l'index 21, il suffit d'écrire :

Code :

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

1
2
var le_txt = les_categories[21].txt;
console.log( 'le_txt : '+le_txt );

on obtient bien : Catégorie 2.

J'ai modifié mon code : https://codepen.io/jreaux62/pen/zMvqeB

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
// --------------
// 1er <select> : on affiche les options dans le 2ème (sous-catégories)
le_select_1.addEventListener('change',function(){
  var le_select_1_idx = this.value;
  if( le_select_1_idx != '')
  {
    console.log( 'le_select_1 sélection : '+les_categories[le_select_1_idx].txt );
    le_select_2.innerHTML = select_options_categorie_by_level_by_parent( les_categories, 1, le_select_1_idx );
    le_select_3.innerHTML = '';
  } else {
    le_select_2.innerHTML = '';
    le_select_3.innerHTML = '';
  }
});

Idem pour les 2 autres <select>.

**Beginner.** · 07/11/2018, 17h31

Il y a plusieurs façons de récupérer le texte de l'option sélectionnée, exemple dans ton cas : le_select_1.selectedOptions[0].textContent...

renvoi le texte de la première option sélectionnée.

**claude.aignant** · 07/11/2018, 17h40

Envoyé par jreaux62

les_categories est un array, contenant des objets.

Bon sang, tout un concept : une variable tableau qui contient des objets...
Après en effet, c'est très pratique!

Merci

**Beginner.** · 07/11/2018, 17h41

Tu peux d’ailleurs afficher cela automatiquement à chaque sélection en ajoutant une ligne de code (la numéro 10) :

Code javascript :

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

1
2
3
4
5
6
7
8
9
10
11
le_select_1.addEventListener('change', function (elt) {
  //  console.log( this.value );
  if (this.value != '') {
    le_select_2.innerHTML = select_options_categorie_by_level_by_parent(les_categories, 1, this.value);
    le_select_3.innerHTML = '';
  } else {
    le_select_2.innerHTML = '';
    le_select_3.innerHTML = '';
  }
  console.log("Le texte de l'option sélectionnée est :", this.selectedOptions[0].textContent);
});

Invité · 07/11/2018, 17h46

1- Beginner. te montre comment récupérer le texte de N'IMPORTE QUELLE <option> (sélectionnée) d'un <select>.

Code :

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

    console.log("Le texte de l'option sélectionnée est :", this.selectedOptions[0].textContent);

2- Cela dit, comme on a une variable JS pour ça, autant s'en servir !

Code :

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

1
2
  var le_select_1_idx = this.value;
    console.log( 'le_select_1 sélection : '+les_categories[le_select_1_idx].txt );

**claude.aignant** · 07/11/2018, 17h47

Envoyé par Beginner.

Il y a plusieurs façons de récupérer le texte de l'option sélectionnée, exemple dans ton cas : le_select_1.selectedOptions[0].textContent...

renvoi le texte de la première option sélectionnée.

Je dirai plutôt

Code :

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

le_select_1.options[le_select_1.selectedIndex].text

car je ne la connais pas à l'avance, l'option choisie.

Mais là je voulais vraiment voir à l'usage ce que donnait cette variable à l'allure inconnue...
Et vu la méthode, çà m'évite des codes à rallonge, ce qui n'est pas plus mal :-)

**Beginner.** · 07/11/2018, 17h49

Ah bah j'ai du mal à poster dans le forum, je ne sais pas ce qui se passe...

Bon je vois que jreaux62 a proposé une autre solution basée sur le tableau mais en générale on peut passer par le HTML pour récupérer le ou les options sélectionnées, oui car il est possible d'en sélectionnées plusieurs dans ce cas la listes est obtenue par : le_select_1.selectedOptions

**Beginner.** · 07/11/2018, 17h59

Envoyé par claude.aignant

Je dirai plutôt

Code :

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

le_select_1.options[le_select_1.selectedIndex].text

...

Oui c'est une autre manière mais je crois que celle-ci ne permet pas de récupérer toutes les options sélectionnées dans le cas où il y'en aurait plusieurs mais bon dans le cas d'une seule option c'est équivalent...

Envoyé par claude.aignant

...car je ne la connais pas à l'avance, l'option choisie.

??? Je n'ai pas compris, avec la solution que j'ai postée tu n'as pas besoin de connaitre à l'avance l’option choisie....

**Beginner.** · 07/11/2018, 18h12

Ah oui en relisant je me dis que je t'ai peut-être embrouillé quand je dis "renvoi le texte de la première option sélectionnée", j'aurais peut-être dû dire "renvoi le texte de la première des options sélectionnées (dans le cas où il y en a plusieurs)"

Alors ceci le_select_1.selectedOptions renvoi une liste de toutes les options sélectionnées.
Et ceci le_select_1.selectedOptions[0] renvoi la première des options sélectionnées (dans le cas où il y en a plusieurs) et bien sûr si il n'y a qu'une seule option qui est sélectionnée eh bien cela renvoi cette seule option.

Ceci le_select_1.selectedOptions[1] renverrait la deuxième des options sélectionnées (dans le cas où il y en aurait une deuxième)...

**Beginner.** · 07/11/2018, 18h20

Tu peux tester cet exemple : https://developer.mozilla.org/en-US/...Options#Result

Regarde on peut sélectionner plusieurs options avec la souris et le code les affiche...

Parse et remplissage de tableaux dynamiques

JavaScript

Discussions similaires

Partager

Partager