Posez votre question Signaler

Liste déroulante multiple, récupérer le contenu [Résolu]

dmoluc 21 Messages postés dimanche 8 juillet 2018Date d'inscription 14 juillet 2018 Dernière intervention - 8 juil. 2018 à 14:27 - Dernière réponse : jordane45 22508 Messages postés mercredi 22 octobre 2003Date d'inscriptionModérateurStatut 18 septembre 2018 Dernière intervention
- 8 juil. 2018 à 18:16
Javascript / DHTML Posez votre question Signaler
Bonjour,
je sais qu'il y a plein de post sur le sujet et pourtant je ne m'en sort pas J'avais une liste déroulante sur une page et mon code fonctionner trés bien 
var texte = 'String'

      document.querySelector("select").addEventListener("change", function() {

          texte=(this.value);

          rechercher();
      }, false);

le problème est que j'ai une nouvelles page avec 4 listes déroulantes et là rien ne va plus. J'y suis depuis ce matin sans le moindre succès.
voilà une de mes listes (la plus petite les autres sont immenses et j'espère qu'il y a une solution car beaucoup de boulot pour rien) 
 <p> <select name="bouteur" select onChange="bouteur.value=this.value" class="donnée" id="bouteur">
        <option id=vide >Bouteur</option>
            <option id=D9U >D9 Lame U</option>
            <option id=D9S >D9 Lame S</option>
            <option id=D8U >D8 Lame U</option>
            <option id=D8S >D8 Lame S</option>
            <option id=D7U >D7 Lame U</option>
            <option id=D7S >D7 Lame S</option>
            <option id=D6S >D6 Lame S</option>
            <option id=D5S >D5 Lame S</option>
            <option id=D4S >D4 Lame S</option>
 </select> 

var texte = 'String'

document.querySelector("select").addEventListener("change", function() {

    texte=(this.value);

    rechercher();
}, false);



//var texte = JQuery(#bouteur option:"selected").text(); //la variable texte reçoit le texte contenu dans l'option sélectionnée.
alert(texte);




rechercher();

quelqu'un aurait une solution qui fonctionne et surtout que je puisse comprendre car pour le moment tout ce que j'ai vu ne fonctionne pas ou que je ne comprend pas
Afficher la suite 

Votre réponse

Répondre au sujet

7 réponses

Signaler Commenter la réponse de jordane45
jordane45 22508 Messages postés mercredi 22 octobre 2003Date d'inscriptionModérateurStatut 18 septembre 2018 Dernière intervention - 8 juil. 2018 à 14:39
0
Merci
Bonjour,

Plusieurs choses qui ne vont pas...
Déjà... tu as un "select" qui traine en plein milieu et qui n'a rien à faire là.
Ensuite, pourquoi vouloir faire un code avec un listener ... alors que tu as utilisé l'attribut ONCHANGE de ton select...

Il suffit dans le onchange de ton select, d'envoyer directement la valeur à chercher à ta fonction "rechercher" 
<select name="bouteur" onchange="rechercher(this.value);" class="donnée" id="bouteur">


Et vu que tu envoies la valeur à chercher directement en pramètre de la fonction... il faut modifier ta fonction comme ceci: 
function  rechercher(texte) {
 //le reste de ton code

}



NB: Si après ces modifications ton code ne fonctionne toujours pas, reviens nous voir avec le code modifié ET indique nous les éventuelles erreurs qui se trouveraient dans la CONSOLE de ton navigateur.

NB²: Lorsque tu postes ton code sur le forum, n'oublie pas d'indiquer le LANGAGE dans les balises de code afin que l'on aie la coloration syntaxique.
Explications disponibles ici : http://codes-sources.commentcamarche.net/faq/10686-le-nouveau-codes-sources-comment-ca-marche#balises-code


.
Commenter la réponse de jordane45
Signaler Commenter la réponse de dmoluc
dmoluc 21 Messages postés dimanche 8 juillet 2018Date d'inscription 14 juillet 2018 Dernière intervention - 8 juil. 2018 à 15:19
0
Merci
merci pour la réponse mais il doit y avoir quelque chose que je n'ai pas compris car ça ne fonctionne pas 

texte=(this.value);

function rechercher(texte) {

    alert(coucou)

if (texte == "D9 lame U") {
document.getElementById("bull").value = D9 lame U
}

else if (texte == "D9 lame S") {
document.getElementById("bull").value = D9 lame S
}

else if (texte == "D8 lame U") {
document.getElementById("bull").value = D8 lame U
}

else if (texte == "D8 lame S") {
document.getElementById("bull").value = D8 lame S
}

else if (texte == "D7 lame U") {
document.getElementById("bull").value = D7 lame U
}

else if (texte == "D7 lame S") {
document.getElementById("bull").value = D7 lame S
}

else if (texte == "D6 lame S") {
document.getElementById("bull").value = D6 lame S
}

else if (texte == "D5 lame S") {
document.getElementById("bull").value = D5 lame S
}

else if (texte == "D4 lame S") {
document.getElementById("bull").value = D4 lame S

}



<p> <select name="bouteur" onChange="rechercher(this.value)" class="donnée" id="bouteur">
        <option id=vide >Bouteur</option>
            <option id=D9U >D9 Lame U</option>
            <option id=D9S >D9 Lame S</option>
            <option id=D8U >D8 Lame U</option>
            <option id=D8S >D8 Lame S</option>
            <option id=D7U >D7 Lame U</option>
            <option id=D7S >D7 Lame S</option>
            <option id=D6S >D6 Lame S</option>
            <option id=D5S >D5 Lame S</option>
            <option id=D4S >D4 Lame S</option>
 </select>



et voilà le message d'erreur de Firefox : [Afficher/Masquer les détails du message.] ReferenceError: rechercher is not defined[En savoir plus]
bull2.html:1:1
onchange
file:///C:/Users/DMO/Desktop/html/bull2.html:1:1
receiveMessage
resource://gre/modules/SelectContentHelper.jsm:293:13
Commenter la réponse de dmoluc
Signaler Commenter la réponse de dmoluc
dmoluc 21 Messages postés dimanche 8 juillet 2018Date d'inscription 14 juillet 2018 Dernière intervention - 8 juil. 2018 à 15:39
0
Merci
en fait la valeur je pourrais la récupérée dans la première zonne de texte (id bull) mais bien sur je ne sais pas comment m'y prendre, ensuite je sais faire pour récupérer la valeur et lancer la recherche des éléments manquants 

<p><input type="texte" id="bull" placeholder="Bouteur"> 
<input type="text" id="RHfort"  placeholder="lecture abaque"> 
<input type="text" id="corecteur" value=0.70> 
<input type="text" id="indice" placeholder="indice foisonnement" > 
<input type="text" id="pente" placeholder="Coef pente" > 
<input type="text" id="efficience"  placeholder="Coef efficience"> 
<input type="text" id="efficience" placeholder="Rendement"</p>
Commenter la réponse de dmoluc
Signaler Commenter la réponse de jordane45
jordane45 22508 Messages postés mercredi 22 octobre 2003Date d'inscriptionModérateurStatut 18 septembre 2018 Dernière intervention - 8 juil. 2018 à 16:05
0
Merci
Oulaaaa.... y'a du boulot....
- Tu n'as toujours pas mis la coloration syntaxique !!
- dans un SELECT .. les options n'ont pas d'attribut ID mais un attribut VALUE
- Que fou ce 
texte=(this.value);
juste avant ta fonction ??? Il n'a rien à faire là.
- Les "textes" doivent être entre guillemets
- Pourquoi faire des IF .. vu que tu veux directement recupérer la valeur dans le champ input


Bref...
Essayes ça 
<!DOCTYPE html>
<html>
 <head>
  <title> TEST </title>
  <meta charset="utf8">
 </head>

  <body> 
      <p> 
      <select name="bouteur" onChange="rechercher(this)" class="donnée" id="bouteur">
        <option value="">Bouteur</option>
        <option value="D9U" >D9 Lame U</option>
        <option value="D9S" >D9 Lame S</option>
        <option value="D8U" >D8 Lame U</option>
        <option value="D8S" >D8 Lame S</option>
        <option value="D7U" >D7 Lame U</option>
        <option value="D7S" >D7 Lame S</option>
        <option value="D6S" >D6 Lame S</option>
        <option value="D5S" >D5 Lame S</option>
        <option value="D4S" >D4 Lame S</option>
     </select>
  
    <p><input type="texte" id="bull" placeholder="Bouteur"> 
    <input type="text" id="RHfort"  placeholder="lecture abaque"> 
    <input type="text" id="corecteur" value=0.70> 
    <input type="text" id="indice" placeholder="indice foisonnement" > 
    <input type="text" id="pente" placeholder="Coef pente" > 
    <input type="text" id="efficience"  placeholder="Coef efficience"> 
    <input type="text" id="efficience" placeholder="Rendement"</p>

    <script type="text/javascript">
    function rechercher(elm) {
      var optionValue = elm.value
      var optionText = elm.options[elm.selectedIndex].text;
      alert(optionText);
      document.getElementById("bull").value = optionText;
    }
    </script>
  </body>
</html>


PS: Vu tes erreurs... avant de poursuivre tu devrais te former un minimum... ce qu'est une variable et comment l'utiliser.





Signaler Commenter la réponse de dmoluc
dmoluc 21 Messages postés dimanche 8 juillet 2018Date d'inscription 14 juillet 2018 Dernière intervention - 8 juil. 2018 à 16:43
super c'est exactement ce que je recherchais, un grand merci jordanne 45
Commenter la réponse de jordane45
Signaler Commenter la réponse de dmoluc
dmoluc 21 Messages postés dimanche 8 juillet 2018Date d'inscription 14 juillet 2018 Dernière intervention - 8 juil. 2018 à 16:41
0
Merci
Merci, ça fonctionne du tonnerre mais il faut que je place la fonction dans le head sinon le code ne reconnais pas "rechercher"
a force de passer le code en revue, j'ai vu horrifié que j'avais écrit plein de coquilles comme quoi travailler le dimanche ça ne me réussis pas, mais encore un grand merci je vais enfin pouvoir avancer.
Ce n'est sans doute pas la meilleur façon de faire mais je me sers de liste déroulante et de fonction java pour créer une base de donnée pas mal étoffée. Il doit y avoir des moyens plus simples que je ne connais pas, alors quel nouveau langage dois-je apprendre pour réaliser des programmes plus performants?
Signaler Commenter la réponse de jordane45
jordane45 22508 Messages postés mercredi 22 octobre 2003Date d'inscriptionModérateurStatut 18 septembre 2018 Dernière intervention - 8 juil. 2018 à 18:16
C'est du javascript et non du Java (deux langages différents ! )
Ensuite, pour faire une BDD.. tu peux utiliser mysql....
Quoi qu'il en soit, il te faut apprendre le SQL et un langage serveur comme le PHP par exemple.
Commenter la réponse de dmoluc

Votre réponse

Répondre au sujet
Posez votre question
S'inscrire maintenant

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.

Les tops du mois