Affichage selectif de label suivant le contenu d'un champ

Résolu

pulls Messages postés 136 Date d'inscription Statut Membre Dernière intervention -
pulls Messages postés 136 Date d'inscription Statut Membre Dernière intervention - 29 déc. 2012 à 18:37

Bonjour,

je suis débutant en developpement web. Dans un formulaire php, J'ai une liste déroulante qui contient 2 éléments ( entree et sortie).

Je voudrais que quand je sélectionne ENTREE, le Label EXPEDITEUR s'affiche dans le champ suivant, et si par contre je selectionne plutot SORTIE, que le Label DESTINATAIRE s'affiche dans le champ suivant.

Je ne sais comment procéder.

Je vous prie de m'aider
97</config>

Afficher la suite

A voir également:

Affichage selectif de label suivant le contenu d'un champ
Le fichier à télécharger correspond au contenu brut d’un courrier électronique. de quel pays a été envoyé ce message ? - Guide
Affichage double ecran - Guide
Label printer logiciel - Télécharger - Outils professionnels
Suivi de modification word - Guide
Fusionner deux cellules excel en gardant le contenu - Guide

9 réponses

Réponse 1 / 9

tryan44 Messages postés 1288 Date d'inscription Statut Membre Dernière intervention 220

Salut,

Je n'ai pas saisie quoi doit s'afficher ou?

Réponse 2 / 9

Alain_42 Messages postés 5361 Date d'inscription Statut Membre Dernière intervention 894

Bonsoir,

une solution:

<head>
<script type="text/javascript">
function ecrire_input(){
	//on lit le choix dans la liste
	var choix_liste=document.getElementById('liste1').value;
	//on atteint le div a ecrire 
	var div_champ_input=document.getElementById('id_ecrire');
	if(choix_liste == 'entree'){
		//on ecrit l'input avec le label Expediteur
		div_champ_input.innerHTML='<label>EXPEDITEUR</label><input type="texte" name="champ_x" value="" />';
	}else if(choix_liste == 'sortie'){
		//on ecrit l'input avec le label Destinataire
		div_champ_input.innerHTML='<label>DESTINATIRE</label><input type="texte" name="champ_x" value="" />';
	}else{
		
		//on ecrit rien
		div_champ_input.innerHTML='';
	
	}

}
</script>
</head>
<body>
<form name="form1" method="post" action="...." >
<select name="liste1" id="liste1" onchange="ecrire_input();" >
	<option value="-1"> -- Choisissez --</option>
	<option value="entree"> Entrée</option>
	<option value="sortie">Sortie</option>

</select>
<div id="id_ecrire"><!-- la sera ecrit l'input --></div>
......

Réponse 3 / 9

pulls Messages postés 136 Date d'inscription Statut Membre Dernière intervention 3

Bonsoir,

je vous remercie infiniment de vouloir m'aider. S'il vous plait, après beaucoup de recherches , j'ai essayé de faire ce que vous me proposez, mais ça ne marche. Je voudrais savoir si c'est mon environnement de developpement qui ne supporte pas INNERHTML, car je developpe sur dreamweaver cs3, peut etre ma version de HTML ne supporte pas cela.

Y a t-il un problème de version de HTML?

merci

Réponse 4 / 9

Alain_42 Messages postés 5361 Date d'inscription Statut Membre Dernière intervention 894

Testes directement dans ton navigateur

et c'est innerHTML

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question

Réponse 5 / 9

pulls Messages postés 136 Date d'inscription Statut Membre Dernière intervention 3

Excusez moi,

Sans abuser de votre temps, je ne comprends pas ce que vous voulez dire par tester directement dans le navigateur. J'utilise Dreamweaver CS3 , pour tapez mes codes, voici ce que j'ai fait:

<!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=latin1" /> 

<title>ag_ajout mouvement</title> 
<?php  
//Importation des fonctions 
 include '../function/configConnexion.php'; 
 include '../function/function.php'; 
  
?> 

<script language="javascript" src="function/function_js.js"></script> 
<script language="javascript"> 
function showChoice(){ 

 var choix_liste=document.getElementById('liste1').value; 
 var div_champ_input=document.getElementById('id_ecrire'); 
  
  if (choix_liste=='Sortie'){ 
   div_champ_input.innerHTML='<p> Bonjour mes amis </p>'; 
   } 
  else if (choix_liste=='Entree'){ 
   
     div_champ_input.innerHTML='<p> Bonjour mes copains </p>'; 
     } 
  else 
   { 
   div_champ_input.innerHTML=' '; 
   } 


</script> 


</head> 


<body onload="document.form.date.focus()"> 
<form id="form" name="form"  action="mouvement_ajoutForm_test.php" method="post"> 
  <table class="important" width="553" height="228" border="0" cellpadding="0" cellspacing="10" bgcolor="#FF00FF"> 
     
    <tr> 
      <td width="109" height="150"><div align="right" class="Style12">Type:</div></td> 
      <td width="200"><label> 
        <select name="liste1" id="liste1" onchange="showChoice();"  > 
          <option value="init">Type mouvement</option> 
          <option value="Entree">Entrée</option> 
          <option value="Sortie">Sortie</option> 
        </select> 
      </label></td> 
      <td width="174" colspan="2" > 
         
        <table width="204" height="91" border="0" cellspacing="2" bordercolor="#0000FF" id="id_ecrire"> 
          <p> Bonjour</p> 
            </table>     </td> 
    </tr> 
  </table> 
</form> 
</body> 
</html>

j'ai voulu faire quelque chose de simple d'abord, mais Bonjour mes amis ou bonjour mes copains ne s'affiche pas dans le navigateur, pourtant le formulaire s'affiche bien avec Bonjour.

veuillez un peu regarder s'il vous plait.

Réponse 6 / 9

Alain_42 Messages postés 5361 Date d'inscription Statut Membre Dernière intervention 894

une erreur dans ton code:

<!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=latin1" /> 

<title>ag_ajout mouvement</title> 
<?php  
//Importation des fonctions 
 include '../function/configConnexion.php'; 
 include '../function/function.php'; 
  
?> 

<script language="javascript" src="function/function_js.js"></script> 
<script language="javascript"> 
function showChoice(){ 

 var choix_liste=document.getElementById('liste1').value; 
 var div_champ_input=document.getElementById('id_ecrire'); 
  
  if (choix_liste=='Sortie'){ 
   div_champ_input.innerHTML='<p> Bonjour mes amis </p>'; 
   } 
  else if (choix_liste=='Entree'){ 
   
     div_champ_input.innerHTML='<p> Bonjour mes copains </p>'; 
     } 
  else 
   { 
   div_champ_input.innerHTML=' '; 
   } 

} //il te manquait cette accolade
</script> 


</head> 


<body onload="document.form.date.focus()"> 
<form id="form" name="form"  action="mouvement_ajoutForm_test.php" method="post"> 
  <table class="important" width="553" height="228" border="0" cellpadding="0" cellspacing="10" bgcolor="#FF00FF"> 
     
    <tr> 
      <td width="109" height="150"><div align="right" class="Style12">Type:</div></td> 
      <td width="200"><label> 
        <select name="liste1" id="liste1" onchange="showChoice();"  > 
          <option value="init">Type mouvement</option> 
          <option value="Entree">Entrée</option> 
          <option value="Sortie">Sortie</option> 
        </select> 
      </label></td> 
      <td width="174" colspan="2" > 
         
        <table width="204" height="91" border="0" cellspacing="2" bordercolor="#0000FF" id="id_ecrire"> 
          <p> Bonjour</p> 
            </table>     </td> 
    </tr> 
  </table> 
</form> 
</body> 
</html>

ensuite je ne connait pas dreamweaver mais pour tester un code tu l'enregistres et ensuite tu tapes son adresse dans la barre d'adresse du navigateur le javascript sera exécuté.

Réponse 7 / 9

pulls Messages postés 136 Date d'inscription Statut Membre Dernière intervention 3

Merci Alain_42,

ouf, ça marche enfin... merci

Dites moi s'il vous plait, est ce qu'il n'y a pas un débogueur pour javascript? un environnement pour tester les codes pour chercher l'erreur?

Cordialement.

Réponse 8 / 9

Alain_42 Messages postés 5361 Date d'inscription Statut Membre Dernière intervention 894

un debogueur oui, si tu utilises Firefox comme navigateur, tu as dans menu Outils Developeur web
tu as console d'erreur

Réponse 9 / 9

pulls Messages postés 136 Date d'inscription Statut Membre Dernière intervention 3

Merci Alain_42, pour tout ce que vous faites pour moi, je ne saurai jamais vous le dire.

Le débogueur de Firefox m'a permis de trouver une grosse erreur dans mes codes.

Regardez:

function schowchoice(){

	var choix_liste=document.getElementById('type').value;
	var div_champ_input=document.getElementById('id_ecrire');
	
		if (choix_liste=='Sortie'){
			div_champ_input.innerHTML='<p> Bonjour mes amis </p>';
			}
		else if (choix_liste=='Entree'){
		
div_champ_input.innerHTML='<table width="179" border="0">
<tr><td>Expéditeur</td></tr>
<tr><td>&nbsp;
  </td></tr> </table>';      
         
        
     
		   }
		else
			{
			div_champ_input.innerHTML=' ';
			}

}

Grâce au débogueur, j'ai compris qu'il fallait faire la concatenation de toutes ces lignes comme suit:

function schowchoice(){

var choix_liste=document.getElementById('type').value;
var div_champ_input=document.getElementById('id_ecrire');

if (choix_liste=='Sortie'){
div_champ_input.innerHTML='<p> Bonjour mes amis </p>';
}
else if (choix_liste=='Entree'){
div_champ_input.innerHTML='<table width="179" border="0"><tr>td>Expéditeur</td></tr><tr><td> '+
'</td></tr> </table>';

}
else
{
div_champ_input.innerHTML=' ';
}

}

Encore merci

J'aimerai vous connaitre Alain_42, si vous le permettez, je ne sais pas si c'est autorisé d'échanger de emails dans ce forum.

Discussions similaires

Nom de champs du tableau croisé dynamique non valide

Contenue masqué

ca veut dire quoi wmg sur youtube ?

Votre réponse

Discussions similaires