Liste déroulante avec possibilité saisie [Résolu/Fermé]

Signaler
Messages postés
1302
Date d'inscription
lundi 25 février 2008
Statut
Membre
Dernière intervention
28 décembre 2020
-
Messages postés
5358
Date d'inscription
dimanche 3 février 2008
Statut
Membre
Dernière intervention
13 février 2017
-
Bonjour,

Je veux créer une liste déroulante qui permettra de choisir une des ligne désirée
$select = 'SELECT * FROM lieux ORDER BY lieu ASC'; 
$result = mysql_query($select,$link) or die ('Erreur : '.mysql_error() );

while($row = mysql_fetch_array($result)) 
    {	
    	echo '<SELECT name="lieu_naissance">';
		echo '<OPTION VALUE="X"></OPTION>';	
		echo '<OPTION VALUE="naissance">'.$row['lieu'].'</OPTION>';
		echo '</SELECT>';
	}


Si aucun choix de la liste ne convient, je veux avoir la possibilité de saisir une nouvelle entrée dans la liste (première ligne de la liste déroulante VALUE="X") qui sera ensuite enregistré dans la base.
Mais comme c'est écrit, je n'arrive pas à saisir ...... !
Comment faire ?
Merci.

13 réponses

Messages postés
5358
Date d'inscription
dimanche 3 février 2008
Statut
Membre
Dernière intervention
13 février 2017
886
voir commentaires et solution:
<?php 
$select = 'SELECT * FROM lieux ORDER BY lieu ASC';  
$result = mysql_query($select,$link) or die ('Erreur : '.mysql_error() ); 

while($row = mysql_fetch_array($result))  

    {  
     echo '<SELECT name="lieu_naissance">'; 
  echo '<OPTION VALUE="X"></OPTION>';  
  echo '<OPTION VALUE="naissance">'.$row['lieu'].'</OPTION>'; 
  echo '</SELECT>'; 
 } 
 /* 
  
 REMARQUES: 
 tel que ton code est fait avec les balise <select de la liste dans la boucle while tu va avoir autant de listes que de résultast de ta requette 
 et toutes avec le même name donc pb lors de la recupération dan $_POST 
  
 */ 
  
?>  

//une solution avec du javascript qui va rajouter l'input seulement si tu choisit "autre" dans la liste 
<html> 
<head> 
<script type="text/javascript"> 
function ajout_input(){ 
 //lecture du choix dans la liste suite au onchange (liste atteinte par son id ) 
 var choix_naissance=document.getElementById('lieu_naissance').value; 
 if(choix_naissance =='autre'){ 
  //on rajoute l'input dans le div par un innerHTML 
  document.getElementById('div_input_autre').innerHTML='Precisez:<input type="texte" name="lieu_naissance_autre" id="lieu_naissance_autre" value="" />';
 document.getElementById('lieu_naissance_autre').focus(); //et on lui donne le focus
 }else{ 
  document.getElementById('div_input_autre').innerHTML=''; //sinon on efface l'input eventuellement affiché 
 } 
} 

</script> 
</head> 
<body> 
<form name="form1" method="post" action=""> 
<?php 
$select = 'SELECT * FROM lieux ORDER BY lieu ASC';  
$result = mysql_query($select,$link) or die ('Erreur : '.mysql_error() ); 
//balise en minuscule et rajout de l'id et du onchange pour appel de la fonction javascript 
//et balise <select en dehors de la noucle while 
echo '<select name="lieu_naissance" id="lieu_naissance" onchange="ajout_input();">';  
echo '<option value="autre">--choisissez--</option>'; // ligne obligatoire pour avoir un changement a tous les coups 
while($row = mysql_fetch_array($result))  
    {  
  echo '<option value="'.$row['lieu'].'">'.$row['lieu'].'</option>'; 
   
 } 
echo '</select>'; 
echo '<div id="div_input_autre"></div>'; //div ou sera rajouté l'input par javascript 
?> 

//et dans le script de récupération: 

<?php 

if($_POST['lieu_naissance']== "autre"){ 
 $lieu_naissance=$_POST['lieu_naissance_autre']; 
}else{ 
 $lieu_naissance=$_POST['lieu_naissance']; 
}
2
Merci

Quelques mots de remerciements seront grandement appréciés. Ajouter un commentaire

CCM 65492 internautes nous ont dit merci ce mois-ci

Messages postés
5358
Date d'inscription
dimanche 3 février 2008
Statut
Membre
Dernière intervention
13 février 2017
886
ok j'ai fait une petite erreur:

echo '<select name="lieu_naissance" id="lieu_naissance" onchange="ajout_input();">';  
echo '<option value="">--choisissez--</option>'; // ligne obligatoire pour avoir un changement a tous les coups 
while($row = mysql_fetch_array($result))  
    {  
  echo '<option value="'.$row['lieu'].'">'.$row['lieu'].'</option>'; 
   
 } 
 echo '<option value="autre">Autre</option>';
echo '</select>';
2
Merci

Quelques mots de remerciements seront grandement appréciés. Ajouter un commentaire

CCM 65492 internautes nous ont dit merci ce mois-ci

Messages postés
6648
Date d'inscription
mercredi 13 avril 2011
Statut
Membre
Dernière intervention
28 septembre 2015
1 284
Bonjour,

Avec SELECT et OPTION seul c'est pas possible.

la solution est de rajouter après </select>

un champ <input.............../>

dont vous testerez le contenu au moment de traiter le formulaire:
- si input vide, prendre en compte la valeur sélectionnée
- si input pas vide, prendre en compte valeur de input

A+
Messages postés
422
Date d'inscription
mercredi 24 septembre 2008
Statut
Membre
Dernière intervention
30 mai 2015
66
l'idéal avec un
<datalist>

mais c'est seulement supporté par FF :/

sinon tu fais tout en javascript comme sur google.com
Messages postés
1302
Date d'inscription
lundi 25 février 2008
Statut
Membre
Dernière intervention
28 décembre 2020
10
Je vais faire comme mpmp93 le dit. Mais c'est dommage, car cela me fait une zone de saisie + une liste déroulante. J'aurais préféré tout mettre ensemble. Dommage que "datalist" n'est pas compatible avec IE. Et le faire en javascript, je ne sais pas .....
Messages postés
1302
Date d'inscription
lundi 25 février 2008
Statut
Membre
Dernière intervention
28 décembre 2020
10
Merci Alain_42 ...... ;o)
Pour ta première remarque, j'avais effectivement vu que je devais sortir le SELECT de la boucle WHILE.
Pour ta solution en javascript, il faut d'abord sélectionner un lieu, puis sélectionner "choisissez" pour que le cadre "Précisez" apparaisse.
Y a t'il possibilité de faire la nouvelle saisie qui écraserait le mot "choisissez" ?
Messages postés
1302
Date d'inscription
lundi 25 février 2008
Statut
Membre
Dernière intervention
28 décembre 2020
10
Bonjour Alain_42,
Effectivement, ça fonctionne génial !!!!!!! ;o)

Par contre, encore une question :
Là, je peux choisir ou saisir un lieu de naissance.
Si sur la même page je veux pouvoir choisir ou saisir un lieu de décès ?
J'ai essayé plusieurs façons pour modifier le javascript, mais je n'y arrive pas ......
Messages postés
1302
Date d'inscription
lundi 25 février 2008
Statut
Membre
Dernière intervention
28 décembre 2020
10
J'ai ajouté une 2° function :

function ajoutdc_input(){
 var choix_dc=document.getElementById('lieu_dc').value; 
 if(choix_dc =='autre'){ 
  //on rajoute l'input dans le div par un innerHTML 
  document.getElementById('div_inputdc_autre').innerHTML='<font size="2" color="red">Précisez : Ville, cp, Département, PAYS</font>&nbsp;<input type="texte" name="lieu_dc_autre" id="lieu_dc_autre" value="" size="55"/>';
 document.getElementById('lieu_dc_autre').focus(); //et on lui donne le focus
 }else{ 
  document.getElementById('div_inputdc_autre').innerHTML=''; //sinon on efface l'input eventuellement affiché 
 } 
}

Mais c'est toujours la première qui est prise en compte.
Pourquoi ?
Messages postés
5358
Date d'inscription
dimanche 3 février 2008
Statut
Membre
Dernière intervention
13 février 2017
886
tu veux dire c'est toujours la première fonction qui est prise en compte ?

as tu bien mis pour la deuxième liste déroulante:

echo '<select name="lieu_dc" id="lieu_dc" onchange="ajoutdc_input();">';


et attention type="text"

//on rajoute l'input dans le div par un innerHTML 
  document.getElementById('div_inputdc_autre').innerHTML='<font size="2" color="red">Précisez : Ville, cp, Département, PAYS</font>&nbsp;<input type="text" name="lieu_dc_autre" id="lieu_dc_autre" value="" size="55"/>';
Messages postés
1302
Date d'inscription
lundi 25 février 2008
Statut
Membre
Dernière intervention
28 décembre 2020
10
Merci de m'avoir répondu Alain_42.
J'ai vérifié par rapport à ce que tu me dis : j'ai corrigé pour "onchange="ajoutdc_input();">" et le type="text" et non "texte".
Mais la deuxième function ne fonctionne toujours pas. Si je veux saisir un autre lieu pour dc, je n'ai pas la ligne "Précisez : ....." qui s'affiche.

<script type="text/javascript"> 
function ajout_input(){ 
 //lecture du choix dans la liste suite au onchange (liste atteinte par son id ) 
 var choix_naissance=document.getElementById('lieu_naissance').value; 
 if(choix_naissance =='autre'){ 
  //on rajoute l'input dans le div par un innerHTML 
  document.getElementById('div_input_autre').innerHTML='<font size="2" color="red">Précisez : Ville, cp, Département, PAYS</font>&nbsp;<input type="texte" name="lieu_naissance_autre" id="lieu_naissance_autre" value="" size="55"/>';
 document.getElementById('lieu_naissance_autre').focus(); //et on lui donne le focus
 }else{ 
  document.getElementById('div_input_autre').innerHTML=''; //sinon on efface l'input eventuellement affiché 
 } 
}

 function ajout2_input(){
 var choix_dc=document.getElementById('lieu_dc').value; 
 if(choix_dc =='autre'){ 
  document.getElementById('div_inputdc_autre').innerHTML='<font size="2" color="red">Précisez : Ville, cp, Département, PAYS</font>&nbsp;<input type="text" name="lieu_dc_autre" id="lieu_dc_autre" value="" size="55"/>';
 document.getElementById('lieu_dc_autre').focus(); 
 }else{ 
  document.getElementById('div_inputdc_autre').innerHTML='';  
 } 
}
</script>

et dans mon code php :
$select = 'SELECT * FROM lieux ORDER BY lieu ASC'; 
$result = mysql_query($select,$link) or die ('Erreur : '.mysql_error() );

echo '<tr align="left"><td>Lieu de naissance : </td>';
echo '<td>';
echo '<select name="lieu_naissance" id="lieu_naissance" onchange="ajout_input();">';  
echo '<option value="autre">--choisissez--</option>'; // ligne obligatoire pour avoir un changement a tous les coups 
echo '<option style="color:red;" value="autre">Saisie d\'un autre lieu</option>';
while($row = mysql_fetch_array($result))  
{  
  echo '<option value="'.$row['lieu'].'">'.$row['lieu'].'</option>'; 
} 
echo '</select>'; 
echo '</td></tr>';
echo '<tr><td width="350"></td><td>';
echo '<div id="div_input_autre"></div>'; //div ou sera rajouté l'input par javascript 
echo '</td></tr>';
?>

plus bas, après du code html
$select = 'SELECT * FROM lieux ORDER BY lieu ASC'; 
$result = mysql_query($select,$link) or die ('Erreur : '.mysql_error() );

echo '<tr align="left"><td>Lieu de décès : </td>';
echo '<td>';
echo '<select name="lieu_dc" id="lieu_dc" onchange="ajoutdc_input();">';  
echo '<option value="autre">--choisissez--</option>'; 
echo '<option style="color:red;" value="autre">Saisie d\'un autre lieu</option>';
while($row = mysql_fetch_array($result))  
{  
  echo '<option value="'.$row['lieu'].'">'.$row['lieu'].'</option>'; 
} 
echo '</select>'; 
echo '</td></tr>';
echo '<tr><td width="350"></td><td>';
echo '<div id="div_inputdc_autre"></div>'; 
echo '</td></tr>';
?>		
Messages postés
5358
Date d'inscription
dimanche 3 février 2008
Statut
Membre
Dernière intervention
13 février 2017
886
un petit manque d'attention:

tu nomme ta fonction dans javascript:
function ajouter2_input()

et dans ta liste dc tu appelles la fonction ajouterdc_input () !!!!!
Messages postés
1302
Date d'inscription
lundi 25 février 2008
Statut
Membre
Dernière intervention
28 décembre 2020
10
Effectivement ! Maintenant ça fonctionne parfaitement !!!
Je te remercie beaucoup ....... ;o))
A ++
J'ai actuellement réaliser votre exemple adapter pour mon code et le soucis et lorsque je selectionne "Autre" rien ne se passe...

<head>

<script type="texte/javascript">
function ajout_input()
{
var choix_taille =document.getElementById('TAILLE').value;
if(choix_taille =='autre')
{
document.getElementById('div_input_autre').innerHTML ='<input type="text" name="taille_autre" id="taille_autre" value="'.stripslashes($TAILLE).'" size="10" class="texte_formulaire"/>';
document.getElementById('taille_autre').focus();
}
else
{
document.getElementById('div_input_autre').innerHTML ='';
}
}
</script>

</head>



/*=========================================
==========================================

<body>


$TAILLE=("SELECT TAILLE FROM TAILLE");
$result=mysql_query($TAILLE) or die ("Requete pas compris");
echo '<p><label for="nom"><span class="texte_formulaire">Taille demandée (Go)</span></br></label>

<SELECT name="TAILLE" id="TAILLE" onchange="ajout_input();">';

echo '<option value="" selected>--Choisissez--</option>';
while($row=mysql_fetch_array($result))
{
echo"<option>$row[0]</option>";
}
echo'<option value="autre">Autre</option>';
echo '</SELECT>';
echo'<div id="div_input_autre"></div>';

</body>
Messages postés
5358
Date d'inscription
dimanche 3 février 2008
Statut
Membre
Dernière intervention
13 février 2017
886
deux énormes erreurs:

- tu mets du php dans le code javascript:
value="'.stripslashes($TAILLE).'"

et de plus cette variable $TAILLE ne contient que le texte de la requette
$TAILLE=("SELECT TAILLE FROM TAILLE");


et penses aussi à mettre autre chose comme nom de base de table de variable que taille