liste déroulante et champ de text liés

**msi79** · 08/09/2013, 20h36

bonjour . cela fait plusieurs jours que je traine sur les différents forums pour me faire aider sur mon problème.
je voudrais que lorsqu'on sélectionne un nom de la liste déroulante l'email correspondant à ce nom s'affice dans le champ text afin que je puisse poster les 2.
exemple quand je sélection Dubois dans le liste déroulante le champ text se rempli avec Dubois@yahoo.fr

le code que je possède affiche que dans le champ text le nom nom sélectionné dans la liste déroulante or je veux que le champ se rempli par le mail de cette personne .

voici e code

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
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
<?php
include("connect.php");
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>Document sans titre</title>
    <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $('#annee').change(function () {
                $('#fieldsemail').val($('#annee option:selected').text());
            });
        });
    </script>
    <style type="text/css">
        #selectedMail {
            margin: 5px 25px;
            border: thin solid #9acd32;
            padding: 5px;
        }
    </style>
</head>
 
<body>
<form method="post" action="reception.php">
    <p>
 
        <select name="annee" id="annee">
            <option value="Choisissez">Choisissez</option>
            <?php
            $req = mysql_query("SELECT id_dest,nom_dest FROM destinateurs ORDER BY nom_dest DESC");
            while ($d = mysql_fetch_assoc($req)) {
                echo '<option value="' . $d['id_dest'] . '">' . $d['nom_dest'] . '</option>'.PHP_EOL;
                }
            ?>
        </select>
    </p>
    <div id="paragrapheSupplementaire">
        <input type="text" name="fieldsemail" id="fieldsemail" value=""/>
    </div>
    <p>
        <input type="submit" value="-- OK --"/>
    </p>
</form>
 
</body>
</html>

**SpaceFrog** · 09/09/2013, 08h45

elle sont ou les adresses mail ? dans un table ? ou tu les as déjà rapatriées coté client lors du chargement de la page ?

**msi79** · 09/09/2013, 15h37

oui les adresse mails sont dans la meme table destinateurs
voici la structure de la table

Code sql :

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
24
25
26
27
28
29
30
31
--
-- Base de données: `------`
--
 
-- --------------------------------------------------------
 
--
-- Structure de la table `destinateurs`
--
 
CREATE TABLE IF NOT EXISTS `destinateurs` (
  `id_dest` int(11) NOT NULL AUTO_INCREMENT,
  `nom_dest` varchar(150) NOT NULL,
  `dest_Direct` varchar(80) NOT NULL,
  `dest_Service` varchar(80) NOT NULL,
  `dest_Contact` varchar(15) NOT NULL,
  `dest_Mail` varchar(30) NOT NULL,
  PRIMARY KEY (`id_dest`)
) ENGINE=InnoDB  DEFAULT CHARSET=latin1 AUTO_INCREMENT=15 ;
 
--
-- Contenu de la table `destinateurs`
--
 
INSERT INTO `destinateurs` (`id_dest`, `nom_dest`, `dest_Direct`, `dest_Service`, `dest_Contact`, `dest_Mail`) VALUES
(9, 'FOFANA KARIM', 'DIRECTION DE LA PLANIFICATION', 'STATISTIQUE', '45621236', 'kamin02@yahoo.fr'),
(10, 'YAO ANDEA', 'DIRECTION DE LA PLANIFICATION', 'STATISTIQUE', '01458575', 'andea@gmail.com'),
(11, 'DIGBEU ARISTIDE', 'DIRECTION DE LA PLANIFICATION', 'STATISTIQUE', '45655878', 'aro@hotmail.com'),
(12, 'SANOGO ABDRAMANE', 'DIRECTION DE LA PLANIFICATION', 'STATISTIQUE', '01458575', 'kamin02@yahoo.fr'),
(13, 'YEO AFFOUET', 'DIRECTION DE LA PLANIFICATION', 'STATISTIQUE', '25789563', 'kamin02@yahoo.fr'),
(14, 'msi79', 'DIRECTION DE LA PLANIFICATION', 'STATISTIQUE', '01458575', 'kamin02@yahoo.fr');

**SpaceFrog** · 09/09/2013, 16h34

Heu ...
c'etait juste pour savoir ou elles se situaient ...

vu qu'elles sont dans une table coté serveur tu peux sur le onchange de ton select faire une requete ajax pour recupérer le mail en fonction de l'id ...

**Alexdezark** · 09/09/2013, 16h46

Bonjour,

Si tu as juste besoin du nom et de l'email, ne récupère pas l'identifiant unique et fait :

Code php :

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

1
2
3
4
5
6
7
8
9
<select name="annee" id="annee" onchange="afficheMail()">
<option value="Choisissez">Choisissez</option>
<?php
$req = mysql_query("SELECT dest_Mail,nom_dest FROM destinateurs ORDER BY nom_dest DESC");
            while ($d = mysql_fetch_assoc($req)) {
                echo '<option value="' . $d['dest_Mail'] . '">' . $d['nom_dest'] . '</option>'.PHP_EOL;
                }
            ?>
        </select>

puis

Code :

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

1
2
3
var afficheMail = function () {
    $('#fieldsemail').val($("#annee").val());
};

Bonne journée

**msi79** · 09/09/2013, 21h01

merci beaucoup ça marche je veux ajouter un deuxième champ texte
comment je fais
ma requète deviens :

Code php :

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

$req = mysql_query("SELECT dest_Mail,nom_dest,dest_Contact FROM destinateurs ORDER BY nom_dest DESC");

j'ai modifié le code mais ça affiche le mail dans les deux champs or le deuxieme champ devrait contenir le contact .
voici le code que j'ai tenté :

Code php :

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
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
<?php
include("connect.php");
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>Document sans titre</title>
    <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
    <script type="text/javascript">
var afficheMail = function () {
    $('#fieldsemail').val($("#annee").val());
	$('#fieldscontact').val($("#annee").val());
};
    </script>
    <style type="text/css">
        #selectedMail {
            margin: 5px 25px;
            border: thin solid #9acd32;
            padding: 5px;
        }
    </style>
</head>
 
<body>
<form method="post" action="reception.php">
    <p>
 
<select name="annee" id="annee" onchange="afficheMail()">
<option value="Choisissez">Choisissez</option>
<?php
$req = mysql_query("SELECT dest_Mail,nom_dest,dest_Contact FROM destinateurs ORDER BY nom_dest DESC");
            while ($d = mysql_fetch_assoc($req)) {
                echo '<option value="' . $d['dest_Mail'] . '">' . $d['nom_dest'] . '</option>'.PHP_EOL;
                }
            ?>
        </select>
    </p>
    <div id="paragrapheSupplementaire">
        <input type="text" name="fieldsemail" id="fieldsemail" value=""/>
    </div>
        <div id="paragrapheSupplementaire2">
        <input type="text" name="fieldscontact" id="fieldscontact" value=""/>
    </div>
    <p>
        <input type="submit" value="-- OK --"/>
    </p>
</form>
 
</body>
</html>

**SpaceFrog** · 10/09/2013, 08h19

donc rien à voir avec javascript ni jquery ...

merci de poser les questions dans les forums appropriés => php mysql ..

**Alexdezark** · 12/09/2013, 11h24

Bonjour,

Heu.. je suis pas tout à fait d'accord avec toi spacefrog.

Son problème semble bien relever du javascript et il devrait pour ce qu'il souhaite faire une requête ajax (ou $.post) pour récuperer tous les éléments dont il a besoin avant de construire son select.

En effet dans son code ceci ne peut pas marcher, dumoins pas pour avoir des résultats différents dans les 2 champs :

Code :

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

1
2
3
4
5
6
    <script type="text/javascript">
var afficheMail = function () {
    $('#fieldsemail').val($("#annee").val());
	$('#fieldscontact').val($("#annee").val());
};
    </script>

Donc msi79, prend connaissance de la doc jQuery pour interroger un fichier via une requête, soit $.ajax, $.post, $.get et récuperer la réponse du fichier.

En l'occurence ce fichier contiendra ta requete SQL.

Pour transmettre des données "saines" penche toi aussi du coté d'une réponse sous forme de chaine JSON encoded.

Reviens nous voir si tu as des questions

Bonne journée

@spacefrog : je pense que faire une requête à chaque fois que le select change est un peu couteux, il vaut mieux à mon avis construire un Objet javascript contenant le résultat de la requête ajax et l'exploiter lors des événements onchange du select pour remplir les champs.
d'accord ?

**SpaceFrog** · 12/09/2013, 11h29

Cela dépend du nombre de users ...
si il a en totu et pour tout un max d'un centaines de mail il suffit de tout charger au moment du load dans un array ou un json et aller chercher dans le json sur le onchange, evitant ainsi les ajax ...

**Alexdezark** · 12/09/2013, 11h35

Tu as raison dans l'absolu c'est plus simple.

Juste un petit bémol pour moi, je trouve plus facile de récupérer un JSON dans le retour d'un $.post que de transmettre un array php à javascript.

Mais je suis pas sûr de moi sur ce coup

Il peut aussi générer des input hidden dans un "while" et récupérer leur valeur en jQuery...

Enfin, plein de solutions, mais faut se creuser un peu la tête

liste déroulante et champ de text liés

jQuery

Vue hybride

Discussions similaires

Partager

Partager