IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

Contributions JavaScript / AJAX Discussion :

Les formulaires (partie 1) Comment récupérer les valeurs d'un select multiple ? [Fait] [FAQ]


Sujet :

Contributions JavaScript / AJAX

  1. #1
    Expert éminent sénior
    Avatar de Auteur
    Profil pro
    Inscrit en
    Avril 2004
    Messages
    7 647
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2004
    Messages : 7 647
    Points : 11 136
    Points
    11 136
    Par défaut Les formulaires (partie 1) Comment récupérer les valeurs d'un select multiple ?
    Comment récupérer les valeurs d'un select multiple ?
    http://javascript.developpez.com/faq...#valSelectMult

    - regroupement des déclarations de variables
    - remplacement de document.forms[0] par document.getElementById()- boucle for : le symbole < est mal retranscrit &lt;.
    - suppression du "(comme pour des checkbox)", qui n'a que peut d'intérêt ici car on parle des listes
    - aération du code
    - suppression du alert() car pour le texte d'affichage on fait appel au for in et je trouve cette partie du code hors sujet.

    Comment récupérer les valeurs d'un select multiple ?

    Pour récupérer les valeurs sélectionnées dans un select multiple, il faut parcourir l'ensemble des options de ce select.

    Code javascript : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    var selectedList = new Array();
    var selectBox = document.getElementById("liste");
    var i;
     
    for (i=0; i < selectBox.options.length; i++) 
    {
    	if (selectBox.options[i].selected) 
    	{
    		selectedList.push(selectBox.options[i]);
    	}
    }

    Lien : Comment désélectionner tous les éléments d'un select multiple ?
    J'ai été tenté d'utiliser une variable pour le contenu de selectBox.options.length.
    Qu'en pensez-vous ?

  2. #2
    Expert éminent sénior

    Avatar de vermine
    Profil pro
    Inscrit en
    Mars 2008
    Messages
    6 582
    Détails du profil
    Informations personnelles :
    Âge : 39
    Localisation : Belgique

    Informations forums :
    Inscription : Mars 2008
    Messages : 6 582
    Points : 79 912
    Points
    79 912
    Par défaut
    Pas besoin de variable mais je me demande s'il n'y a pas une version plus courte : selectBox.length (et donc la même utilisation dans la suite du code).

  3. #3
    Expert éminent sénior
    Avatar de Auteur
    Profil pro
    Inscrit en
    Avril 2004
    Messages
    7 647
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2004
    Messages : 7 647
    Points : 11 136
    Points
    11 136
    Par défaut
    Effectivement, même si je reste attaché à la syntaxe selectBox.options.. Je propose donc d'intégrer les deux syntaxes possibles dans cette Q/R.


    Comment récupérer les valeurs d'un select multiple ?

    Pour récupérer les valeurs sélectionnées dans un select multiple, il faut parcourir l'ensemble des options de ce select .

    Code javascript : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    var selectedList = new Array();
    var selectBox = document.getElementById("liste");
    var i;
     
    for (i=0; i < selectBox.options.length; i++) 
    {
    	if (selectBox.options[i].selected) 
    	{
    		selectedList.push(selectBox.options[i]);
    	}
    }

    La collection des options est incluse dans l'objet liste retourné par getElementById(), on peut donc simplifier légèrement le code :
    Code javascript : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    var selectedList = new Array();
    var selectBox = document.getElementById("liste");
    var i;
     
    for (i=0; i < selectBox.length; i++) 
    {
    	if (selectBox[i].selected) 
    	{
    		selectedList.push(selectBox[i]);
    	}
    }

    Lien : Comment désélectionner tous les éléments d'un select multiple ?

  4. #4
    Invité
    Invité(e)
    Par défaut
    Bonjour l'Ami

    Hors sujet, j'ais suivi ton lien et trouvé comment récupérer la valeur sélectionnée dans un Select !

    Je vais mettre en relecture ce soir (j'en avais déjà parlée ) mon mini tableur AJAX.

    En réalisant cet article j'ais buté longtemps sur cette récupération, alors tu la réalise en utilisant
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
     
    document.getElementById('liste').options[document.getElementById('liste').selectedIndex].text
    Ce serait bien de préciset a cet endroit la différence avec
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
     
    document.getElementById('liste').options[document.getElementById('liste').selectedIndex].value
    Par exemple quand tu a
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
     
    <option value='toto' >tata</option>
    <!-            value     text     ->

  5. #5
    Expert éminent sénior
    Avatar de Auteur
    Profil pro
    Inscrit en
    Avril 2004
    Messages
    7 647
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2004
    Messages : 7 647
    Points : 11 136
    Points
    11 136
    Par défaut
    Il y a effectivement une différence entre les attributs text et value. J'ai indiqué ces différences dans ces deux discussions :
    http://www.developpez.net/forums/d13...valeur-select/
    http://www.developpez.net/forums/d13...-texte-select/

  6. #6
    Invité
    Invité(e)
    Par défaut
    OK j'ais vu, mais la ou je te l'indique tu devrais enfoncer le clou

  7. #7
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    Janvier 2011
    Messages
    16 955
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : Janvier 2011
    Messages : 16 955
    Points : 44 103
    Points
    44 103
    Par défaut Relecture
    je ferais juste un regroupement des variables et une déclaration littérale du tableau
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    var selectedList = [],
        selectBox = document.getElementById("liste"),
        i;

  8. #8
    Expert éminent sénior
    Avatar de Auteur
    Profil pro
    Inscrit en
    Avril 2004
    Messages
    7 647
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2004
    Messages : 7 647
    Points : 11 136
    Points
    11 136
    Par défaut
    Ok, pour la déclaration du tableau cela permettra de voir une autre manière de les déclarer.


    Comment récupérer les valeurs d'un select multiple ?

    Pour récupérer les valeurs sélectionnées dans un select multiple, il faut parcourir l'ensemble des options de ce select.

    Code javascript : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    var selectedList = [],
        selectBox = document.getElementById("liste"),
        i;
     
    for (i=0; i < selectBox.options.length; i++) 
    {
    	if (selectBox.options[i].selected) 
    	{
    		selectedList.push(selectBox.options[i]);
    	}
    }

    La collection des options est incluse dans l'objet liste retourné par getElementById(), on peut donc simplifier légèrement le code :

    Code javascript : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    var selectedList = [],
        selectBox = document.getElementById("liste"),
        i;
     
    for (i=0; i < selectBox.length; i++) 
    {
    	if (selectBox[i].selected) 
    	{
    		selectedList.push(selectBox[i]);
    	}
    }


    Lien : Comment désélectionner tous les éléments d'un select multiple ?


    Pour le regroupement des déclarations, j'ai été réticent au début car moi je préfère :
    - soit grouper les déclarations et ensuite initialiser
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    var a, b, c;
    a = 1;
    b = 2;
    c = 3;
    - soit séparer les déclarations si j'initialise au même moment :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    var a, b;
    var c = 3;
     
    a = 1;
    b = 2;
    Mais comme tu as bien présenté (indentation du code) tes déclarations, j'ai changé d'avis. Mais il faut bien faire attention qu'à la fin de la ligne c'est une virgule et pas un point-virgule.

  9. #9
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    Janvier 2011
    Messages
    16 955
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : Janvier 2011
    Messages : 16 955
    Points : 44 103
    Points
    44 103
    Par défaut
    Cette déclaration des variables fait partie de bonnes pratiques mais n'est pas rédhibitoire quoiqu'il arrive.

    Cela laissera apparaître une autre façon de déclarer les variables dans le code.

  10. #10
    Expert éminent sénior
    Avatar de Auteur
    Profil pro
    Inscrit en
    Avril 2004
    Messages
    7 647
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2004
    Messages : 7 647
    Points : 11 136
    Points
    11 136
    Par défaut
    Ok. Ca sera donc la version définitive de la Q/R.
    Merci pour ta relecture et tes avis


+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. [FAQ] Les formulaires (partie 2) : Comment soumettre un formulaire automatiquement ?
    Par Auteur dans le forum Contributions JavaScript / AJAX
    Réponses: 4
    Dernier message: 18/11/2013, 21h33
  2. [FAQ] Les formulaires (partie 1) Comment modifier l'état d'une des options d'un select ?
    Par Auteur dans le forum Contributions JavaScript / AJAX
    Réponses: 4
    Dernier message: 18/11/2013, 21h32
  3. [FAQ] Les formulaires (partie 1) Comment récupérer la valeur d'un select ?
    Par Auteur dans le forum Contributions JavaScript / AJAX
    Réponses: 5
    Dernier message: 16/11/2013, 19h34
  4. [FAQ] Les formulaires (partie 2) : Comment soumettre un formulaire en utilisant un lien ?
    Par Auteur dans le forum Contributions JavaScript / AJAX
    Réponses: 5
    Dernier message: 16/11/2013, 17h55
  5. Réponses: 6
    Dernier message: 24/01/2007, 10h29

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo