Alimenter une zone texte via une zone déroulante

**ecolom** · 03/01/2009, 16h41

Bonjour à tous et surtout, BONNE ANNEE
Après de nombreux essais je me résigne à faire appel à l'équipe du net.
En fait, j'essaie d'alimenter une zone de texte par l'intermédiaire d'une liste déroulante elle même alimentée par un select en sql.
J'ai pu récupérer la fonction js via les tutoriaux qui normalement permet la mise à jour de la zone texte.

Code :

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

1
2
3
<SCRIPT>
	<select name="nomprenom" onchange="this.form.elements['email'].value=this.options[this.selectedIndex].value">
</SCRIPT>

Voici mon formulaire de test:

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
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Test</title>
</head> 
<!-- Fond d ecran-->
<body background="52.jpg" style="background-attachment: fixed">
   <div align="center">
	<table border="0" cellpadding="0" cellspacing="0" width="800" height="600">
		<!-- MSTableType="layout" -->
		<tr>
			<td valign="top" height="600" width="800"> 
<form action ="ticket_enregistre.php" enctype="multipart/form-data" method="post">
<!-- Liste deroulante nomprenom -->
<select name="nomprenom">
  <?php
     include("users.inc.php");
       $liendb = mysql_connect($host,$user,$pws);
       mysql_select_db ($database);     
       $SQL = "SELECT nomprenom, email FROM users order by nom";
       $res = mysql_query($SQL);
     while($val=mysql_fetch_array($res)) 
	{
     echo "<option>".$val["nomprenom"]."</option>\n";
    }
  ?> 
</select>	
<!-- Zone texte email-->
	<input type="text" name="email" size="10">	
<!-- Fichier attache -->
	<input type="file" name="fichierannexe">
 
<!-- Bouton Envoyer vers DB SQL Ticket -->	
	<div style="position: absolute; top: 485px; left: 510px; width: 88px; height: 26px; z-index:1">
		<input type="submit" value="Envoyer">
	</div>
<!-- Bouton clear Gauche -->
	<div style="position: absolute; top: 485px; left: 414px; width: 62px; height: 26px">
	 &nbsp;<input type="reset" name="reset" value="Clear"> 
	</div>
</form>
</body>
</html>

Pouvez-vous me guider et me dire ou je dois placer ce bout de code car j'ai essayé plusieurs endroits mais sans résultats.
Entre les head, après ma zone texte, etc.....

Pouvez-vous aussi me confirmer que ce bout de code est suffisant pour la mise à jour de ma zone texte ?

Merci pour vos indications et aide, j'en ai bien besoin du fait que je suis débutant dans le domaine.
A bientôt

**Jumano** · 03/01/2009, 17h06

Bonjour,
Tu indiques le "onchange" à l'intérieur de ton select :

Code :

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

<select name="nomprenom" onchange="this.form.elements['email'].value=this.options[this.selectedIndex].value">

Et surtout tu donnes une "value" à tes "options" :

Code :

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

echo "<option value='".$val["email"]."' >".$val["nomprenom"]."</option>\n";

**ecolom** · 03/01/2009, 20h11

Merci Jumano.
Effectivement cela fonctionne.

Mais pas de chance pour moi, c'est mon fichier de mise à jour de la db qui déconne maintenant, il met à jour le champs NOM de ma DB avec l'adresse email.
Voici mon bout de code qui met à jour la db intervention.

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
<?php
  // Connexion à la base de données
  include("param.inc.php");
  $liendb = mysql_connect($host,$user,$pws);
  mysql_select_db ($database); 
  // Insertion  des champs du formulaire dans la base de données gestion_sg / Ticket  
  $sql = "INSERT INTO ticket (nomprenom, email )
  VALUES ('".$_REQUEST['nomprenom']."', '".$_REQUEST['email']."')";
 if (mysql_query($sql) !=false) {
  $numticket = mysql_insert_id();
     //Affichage message après sélection du bouton Envoyé
     print("ticket < ".$_request['nomprenom']." > enregistré.");
  }
 else
     print("Echec lors de la création de la demande.");
mysql_close($liendb);

du fait que j'ai adapté le code onchange dans mon formulaire, le champs NOMPRENOM reçoit la valeur email dans ma DB et plus le nomprenom que j'avais avant.
Comment faire pour que les valeurs retrouvent leur places ?

Si tu as une idée Jumano elle est la bienvenue.
En attendant, je continue de chercher.

Merci

**Jumano** · 03/01/2009, 20h17

Effectivement,
Avec

Code :

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

$_REQUEST['nomprenom']

tu récupères la valeurs de l'option de ton select, donc l'adresse email :

Code :

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

<option value='".$val["email"]."' >

**ecolom** · 03/01/2009, 20h25

Effectivement, mais je ne comprends pas comment procéder pour que la db soit mise à jour avec les bonnes valeurs.
Y a t-il une autre fonction à utiliser ?
Si oui, laquelle.

Le but est que les zones se remplissent automatiquement et que je puisse récupérer les valeurs pour les mettrent à jour dans ma DB

Merci

**Jumano** · 03/01/2009, 20h34

J'ai modifié ton code comme ceci :

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
<body background="52.jpg" style="background-attachment: fixed">
   <div align="center">
	<table border="0" cellpadding="0" cellspacing="0" width="800" height="600">
		<!-- MSTableType="layout" -->
		<tr>
			<td valign="top" height="600" width="800"> 
<form action ="ticket_enregistre.php" enctype="multipart/form-data" method="post">
<!-- Liste deroulante nomprenom -->
<select name="nom" onchange="this.form.elements['email'].value=this.options[this.selectedIndex].value; this.form.elements['nomprenom'].value=this.options[this.selectedIndex].text">
<?php  include("users.inc.php");
       $liendb = mysql_connect($host,$user,$pws);
       mysql_select_db ($database);     
       $SQL = "SELECT nomprenom, email FROM users order by nom";
       $res = mysql_query($SQL);
     while($val=mysql_fetch_array($res)) 
        {
     echo "<option value='".$val["email"]."' >".$val["nomprenom"]."</option>\n";
    }
  ?> 
</select>
<!-- Champs caché pour le nomprenom -->
	<input type="hidden" name="nomprenom">
<!-- Zone texte email-->
	<input type="text" name="email" size="10">	
<!-- Fichier attache -->
	<input type="file" name="fichierannexe">
 
<!-- Bouton Envoyer vers DB SQL Ticket -->	
	<div style="position: absolute; top: 485px; left: 510px; width: 88px; height: 26px; z-index:1">
		<input type="submit" value="Envoyer">
	</div>
<!-- Bouton clear Gauche -->
	<div style="position: absolute; top: 485px; left: 414px; width: 62px; height: 26px">
	 &nbsp;<input type="reset" name="reset" value="Clear"> 
	</div>
</form>
</body>

On créé un champs caché nommé "nomprenom" et sur le onchange du select :
- Le champs 'email' prends la valeur de l'option,
- le champs caché 'nomprenom' prend la valeur de l'étiquette (du texte) du select ...

**ecolom** · 03/01/2009, 22h55

Merci Jumano. un cours perso, c'est sympa.

Mais.....

La fonction:

Code :

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

echo "<option>".$val["nomprenom"]."</option>\n";

ne fonctionne pas, elle ne met plus à jour l'adresse email après sélection du nom.
==> j'ai maintenu la fonction que tu m'avais donné auparavant

Code :

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

echo "<option value='".$val["email"]."' >".$val["nomprenom"]."</option>\n";

et là, génial, la Db se met enfin à jour avec les bonnes valeurs.
UN GRAND MERCI.

euh...
ceci concerne une mise à jour automatique pour une zone. ( email )
Si maintenant je veux ajouter une autre zone ( tel )

Je suppose qu'il faut placer ce complément dans la même zone onchange

Code :

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

onchange="this.form.elements['tel'].value=this.options[this.selectedIndex].value; this.form.elements['nomprenom'].value=this.options[this.selectedIndex].text" >

et ajouter

Code :

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

echo "<option value='".$val["email"]."', '".$val["tel"]."' >".$val["nomprenom"]."</option>\n";

je dois avoir un problème avec la syntaxe ou la fonction car pas de réaction.
La zone tél ne s'alimente pas.

je sais j'abuse mais as-tu une idée ?
je suis dans le gaz pour ce type de fonction.

Merci
Eric

**Jumano** · 03/01/2009, 23h08

Autant pour moi j'avais oublier les 'value' des options.

Malheuresement tu ne peux pas faire comme tu l'indiques ...

Ou alors il faudrait faire une concaténation (c'est à dire mettre les valeurs 'email' et 'tel' côte à côte) dans la valeur de l'option, et ensuite couper la valeur en deux pour séparer l'email du tel et donner la bonne valeur à chaque champs ....

Autre solution utiliser la technologie AJAX, ce qui permettrait d'effetuer une requète en fonction du nomprenom dans ta base et d'alimenter tes champs en fonction ==> sasn rechargement de page : dynamiquement ...

**Jumano** · 03/01/2009, 23h34

Essaye ce code :
Code Javascript à placer entre les balises <head> et </head>

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
<script language="javascript">
function copie_champs() {
var nom = document.getElementById('nom');
var valeur_nom = nom.options[nom.selectedIndex].value;
var texte_nom = nom.options[nom.selectedIndex].text;
 
var tableau_nom = valeur_nom.split("-");
 
document.getElementById('email').value = tableau_nom[0];
document.getElementById('tel').value = tableau_nom[1];
document.getElementById('nomprenom').value = texte_nom;
}
</script>

Ensuite :

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
<body background="52.jpg" style="background-attachment: fixed">
<div align="center">
<table border="0" cellpadding="0" cellspacing="0" width="800" height="600">
<!-- MSTableType="layout" -->
<tr>
<td valign="top" height="600" width="800"> 
<form action ="ticket_enregistre.php" enctype="multipart/form-data" method="post">
<!-- Liste deroulante nomprenom -->
<select name="nom" id="nom" onchange="copie_champs();">
<?php  include("users.inc.php");
       $liendb = mysql_connect($host,$user,$pws);
       mysql_select_db ($database);     
       $SQL = "SELECT nomprenom, email, tel FROM users order by nom";
       $res = mysql_query($SQL);
     while($val=mysql_fetch_array($res)) 
        {
     echo "<option value='".$val["email"]."-".$val["tel"]."' >".$val["nomprenom"]."</option>\n";
    }
?> 
</select>
<!-- Champs caché pour le nomprenom -->
	<input type="hidden" name="nomprenom" id="nomprenom">
<!-- Zone texte email-->
	<input type="text" name="email" id="email" size="10">
<!-- Zone texte tel-->
	<input type="text" name="tel" id="tel" size="20">	
<!-- Fichier attache -->
	<input type="file" name="fichierannexe">
 
<!-- Bouton Envoyer vers DB SQL Ticket -->	
<div style="position: absolute; top: 485px; left: 510px; width: 88px; height: 26px; z-index:1">
<input type="submit" value="Envoyer">
</div>
<!-- Bouton clear Gauche -->
<div style="position: absolute; top: 485px; left: 414px; width: 62px; height: 26px">
 &nbsp;<input type="reset" name="reset" value="Clear"> 
</div>
</form>
</body>

**ecolom** · 04/01/2009, 00h02

BINGO...

cette fois je vois le bout du tunnel. Un grand merci pour ton aide.
Je vais maintenant appliquer les modifs dans ma page principale avec ces fonctions qui m'aident bcp.
Bien sûr, je ne me limite pas à email et tel, je dois encore ajouter 5 zones supplémentaires.
Je pense qu'avec le code que tu viens de me donner, je vais pouvoir m'en sortir tout seul... ( enfin j'espère )

Après le remplissage de ce formulaire, je prévois un envoie d'email vers les personnes qui gère les demandes ainsi que l'utilisateur qui a réservé. Ceci afin que l'utilisateur puisse visualiser et avoir un accusé de réception.
Cela se fera en php donc moins de problème pour écrire le code.

Encore Merci Jumano et j'espère qu'un jour je pourrai aider tout comme tu le fais actuellement.
Quand je mettrai en production cette gestion et qu'elle sera stable, je la déposerai dans ce forum pour que d'autres personnes puissent utiliser et / ou avoir des infos que j'ai longuement cherchés.

Thank's

**Jumano** · 04/01/2009, 00h14

Si tu as d'autres champs à remplir automatiquement, je te conseil de te tourner vers AJAX ==> ici c'est un tutoriel avec deux listes liées, à toi de modifier le code pour obtenir les champs que tu veux à la place du second "select"....

Penses au TAG ==> Résolu

**ecolom** · 04/01/2009, 00h33

html / css / php / javascript / ajax
ouffffff...ça fait bcp.
j'ai peur de m'impliquer dans javascript et ajax en même temps.
Je m'emmêle déjà les pinceaux comme çà...
D'autant que j'ai quelques fonctions javascript dans mes codes.
Je vais mémoriser ton lien et essayerai plus tard.
Pour l'instant, j'ai déjà adapté ton code pour afficher plusieurs zones et c'est ok.

Je peux maintenant finaliser ma page. Reste les emails.

Merci

**ecolom** · 27/04/2009, 16h12

Bonjour à tous,

Jumano m'a bien aidé en son temps afin que je puisse avancer dans la petite gestion que je suis entrain de réaliser.
Elle est enfin terminée mais............et oui quand on crois que tout est parfait, on tombe souvent sur un HIC.

J'utilise le code suivant afin d'alimenter automatiquement certaines zones dans mon formulaire.

<script language="javascript">
function copie_champs() {
var nom = document.getElementById('nom');
var valeur_nom = nom.options[nom.selectedIndex].value;
var texte_nom = nom.options[nom.selectedIndex].text;

var tableau_nom = valeur_nom.split("-");

document.getElementById('email').value = tableau_nom[0];
document.getElementById('tel').value = tableau_nom[1];
document.getElementById('nomprenom').value = texte_nom;
}
</script>

Formulaire :
<body background="52.jpg" style="background-attachment: fixed">
<div align="center">
<table border="0" cellpadding="0" cellspacing="0" width="800" height="600">

<tr>
<td valign="top" height="600" width="800">
<form action ="ticket_enregistre.php" enctype="multipart/form-data" method="post">

<select name="nom" id="nom" onchange="copie_champs();">
<?php include("users.inc.php");
$liendb = mysql_connect($host,$user,$pws);
mysql_select_db ($database);
$SQL = "SELECT nomprenom, email, tel FROM users order by nom";
$res = mysql_query($SQL);
while($val=mysql_fetch_array($res))
{
echo "<option value='".$val["email"]."-".$val["tel"]."' >".$val["nomprenom"]."</option>\n";
}
?>
</select>

<input type="hidden" name="nomprenom" id="nomprenom">

<input type="text" name="email" id="email" size="10">

<input type="text" name="tel" id="tel" size="20">

<input type="file" name="fichierannexe">


<div style="position: absolute; top: 485px; left: 510px; width: 88px; height: 26px; z-index:1">
<input type="submit" value="Envoyer">
</div>

<div style="position: absolute; top: 485px; left: 414px; width: 62px; height: 26px">
 <input type="reset" name="reset" value="Clear">
</div>
</form>
</body>

Mon soucis : Dans la zone email de ma table sql, j'ai des adresses qui ont en contenu un point et un tiret.
Et voilà le GROS problème...l'adresse email qui contient un tiret est tronquée et le résultat ce place sur deux zones de mon formulaire "email" et "tel" j'ai donc une adresse email en deux parties.
J'essaie de comprendre le pourquoi du comment et je me suis dit que c'était certainement la fonction valeur_nom.split ("-") qui déconne puisque j'ai un tiret dans l'adresse. J'ai changé par les / : . ; et le problème persiste.
Avez-vous une suggestion suite à ce prob ?

Merci pour votre aide.

Alimenter une zone texte via une zone déroulante

JavaScript

Discussions similaires

Partager

Partager