lié une liste déroulante avec un champ text

**james23** · 08/07/2010, 12h23

Bonjour,

Je travail avec le langage JSP et base de donnée Oracle
Je voudrai que lorsque la personne choisi un "nom_prenom_res" dans la liste déroulante que le numéro de tel soit automatiquement agrémenté dans un champs text.J'essaye de trouver du code en javascript que effectue cela.
Pour compléter ma liste déroulant, ceci se fait par requète SQL ou chaque nom_prenom_res et associé un tel.

voici mon code pour être plus clair

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
<td><select name = "nomRep" id ="nomRep"style="width : 150px">
	DBConnexion dbc_resp = new DBConnexion();
	String sql_nomResp = "SELECT nom_prenom_res FROM resp_chantier";
	ResultSet resultat_nomResp = dbc_resp.recupereRequete(sql_nomResp);
	while(resultat_nomResp.next())
	{
		out.print("<option>"+resultat_nomResp.getString("nom_prenom_res")+"</option>");
	}
 
	out.print("</select></td>");
	out.print("<td>");
        if(String chp = request.getParameter("nomRep")!= null)
	{
		DBConnexion dbc_telResp = new DBConnexion();
		String sql_telResp = "SELECT tel_res FROM resp_chantier";
		sql_telResp = sql_telResp.concat("WHERE nom_prenom_res = "+resultat_nomResp.getString("nom_prenom_res"));
		ResultSet resultat_telResp = dbc_telResp.recupereRequete(sql_telResp);
 
		out.print("<input type=\"text\" name=\"telResp\" size=\"8\" maxlength=\"10\" value ="+resultat_telResp.getString("tel_res")+"/>");
		dbc_telResp.closeConnexion();
		dbc_resp.closeConnexion();
	}
	dbc_telResp.closeConnexion();
	dbc_resp.closeConnexion();

j'ai déjà réflechi j'ai pensé à ce code mais il ne marche pas
voici le code si jamais sa peut vous mettre sur un piste

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
<td><select name = "nomRep" id ="nomRep"style="width : 150px" onchange="remplitTel(this)"> 
<%
	DBConnexion dbc_resp = new DBConnexion();
	String sql_nomResp = "SELECT nom_prenom_res,tel_res FROM resp_chantier";
	ResultSet resultat_nomResp = dbc_resp.recupereRequete(sql_nomResp);
	String aJs="var tabTelephone=new Array();";
	while(resultat_nomResp.next())
	{
		out.print("<option>"+resultat_nomResp.getString("nom_prenom_res")+"</option>");
		aJs+="tabTelephone['"+resultat_nomResp.getString("nom_prenom_res")+"']='"+resultat_nomResp.getString("tel_res")+"';";
	}
%>
</select></td>
<td><input type="text" name="telResp" disabled size="8" maxlength="10" value ="" /></td>
<script language="javascript">
<%=aJs%>
function remplitTel(selNomRep){
	var nomResp=selNomRep.value;
	var telResp=tabTelephone[nomResp];
	document.getElementById('telResp').value=telResp;
}
</script>

J'espere que j'ai été clair.
Merci d'avance

**vermine** · 08/07/2010, 13h13

Bonjour,

Déclarez aJs en Javascript en dehors des tags JSP. Ensuite:

Code :

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

1
2
3
4
5
6
7
8
 
while(resultat_nomResp.next())
{
     out.print("<option>"+resultat_nomResp.getString("nom_prenom_res")+"</option>");
%>
     aJs["<%=resultat_nomResp.getString("nom_prenom_res")%>"] = "<%=resultat_nomResp.getString("tel_res")%>";
<%
}

**james23** · 08/07/2010, 13h29

Toujours la même chose.
Dans le champs tel_res il met met toujours undefined

**Bovino** · 08/07/2010, 13h39

Et pourquoi tu ne te contentes pas de mettre le numéro de téléphone dans le value de l'option correspondant

Code :

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

1
2
3
4
5
<select onchange="alert(this.value)">
    <option value="0">Faites un choix...</option>
    <option value="0123456789">Premier choix</option>
    <option value="0987654321">Second choix</option>
</select>

**james23** · 08/07/2010, 13h51

j'ai 400 numéro. Je vais pas m'amuser a les rentrer tous en dur alors qu'il sont dans ma base de données

**Bovino** · 08/07/2010, 14h00

En quoi ça dérange

Tu affiches bien tes 400 noms, pourquoi ajouter un attribut value est-il gênant ???

**vermine** · 08/07/2010, 14h10

Wahou je n'avais même pas vu qu'il n'y avait pas de value, me disant bêtement qu'il comportait le nom de la personne. Ce qui gêne un peu pour faire le this.value, non ? Pas d'value, pas de this.value.

**james23** · 08/07/2010, 14h16

désoler mais je ne vois pas ou vous voulez en venir

**vermine** · 08/07/2010, 14h36

Et bien il n'y a pas de value dans vos options:

Code :

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

out.print("<option>"+resultat_nomResp.getString("nom_prenom_res")+"</option>");

Du coup ceci ne fonctionne pas:

Code :

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

1
2
var nomResp=selNomRep.value;

Ce qui rend en toute logique "undefined" à ce niveau-ci:

Code :

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

1
2
 
var telResp=tabTelephone[nomResp];

Ce que Bovino propose, c'est de rajouter le numéro de téléphone comme value de vos options. Dans la boucle, tout simplement. Après il faudra modifier la fonction remplitTel pour récupérer ce numéro.

**james23** · 08/07/2010, 14h41

Je viens de rajouter une value dans mes option toujours pareil

**vermine** · 08/07/2010, 14h44

Pouvons-nous voir le nouveau code ?

**E.Bzz** · 08/07/2010, 14h46

Envoyé par james23

Toujours la même chose.
Dans le champs tel_res il met met toujours undefined

Sauf qu'il n'y a pas de champ tel_res dans ta page ...

A+

**james23** · 08/07/2010, 14h49

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
					<td><select name = "nomRep" id ="nomRep"style="width : 150px" onchange="remplitTel(this)"> 
					<%
						DBConnexion dbc_resp = new DBConnexion();
						String sql_nomResp = "SELECT id_resp, nom_prenom_res,tel_res FROM resp_chantier";
						ResultSet resultat_nomResp = dbc_resp.recupereRequete(sql_nomResp);
						String aJs="var tabTelephone=new Array();";
						while(resultat_nomResp.next())
						{
							out.print("<option value ="+resultat_nomResp.getString("id_resp")+">"+resultat_nomResp.getString("nom_prenom_res")+"</option>");
							aJs+="tabTelephone['"+resultat_nomResp.getString("nom_prenom_res")+"']='"+resultat_nomResp.getString("tel_res")+"';";
						}
 
					%>
						</select></td>
						<td><input type="text" name="telResp" disabled size="8" maxlength="10" value ="" /></td>
						<script language="javascript">
						<%=aJs%>
 
						function remplitTel(selNomRep){
							var nomResp=selNomRep.value;
							var telResp=tabTelephone[nomResp];
							document.getElementById('telResp').value=telResp;
						}
						</script>

**E.Bzz** · 08/07/2010, 14h52

Aucun miracle : toujours pas de champ tel_res dans ta page.

Merci d'être plus précis : difficile de débugger en se basant sur des approximations

A+

**vermine** · 08/07/2010, 14h54

Tout d'abord, pourquoi l'id de la personne comme value au lieu du numéro de téléphone ?

Ensuite, comme la soulignée E.Bzz, il faut un id sur votre input

Code :

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

<input type="text" id="telResp" name="telResp" disabled size="8" maxlength="10" value ="" />

E.Bzz, c'est cet input qui est utilisé.

Et finalement, oubliez les tableaux aJs et tabTelephone. Car vous allez directement interroger le value de l'option (une fois que vous aurez-mis le numéro de téléphone). Sauf si vous avez réellement besoin du tableau mais alors je ne pense pas qu'il faille le remplir ainsi.

**E.Bzz** · 08/07/2010, 14h56

Envoyé par vermine

il faut un id sur votre input

Exact, Vermine.

Mais cet input là a bien un id (telResp), d'où ma question ...

A+

**vermine** · 08/07/2010, 14h57

Non, l'id c'est moi qui l'ai rajouté car le name ne suffira pas sur tous les navigateurs. Par contre on joue avec des tableaux mal construits et inutiles à mon sens.