Formulaire HTML : menu déroulant modifiable
Fermé
phiper78
-
9 sept. 2009 à 22:02
phiper78 Messages postés 2 Date d'inscription mercredi 9 septembre 2009 Statut Membre Dernière intervention 11 septembre 2009 - 10 sept. 2009 à 13:45
phiper78 Messages postés 2 Date d'inscription mercredi 9 septembre 2009 Statut Membre Dernière intervention 11 septembre 2009 - 10 sept. 2009 à 13:45
A voir également:
- Menu déroulant formulaire html
- Menu déroulant excel - Guide
- Editeur html - Télécharger - HTML
- Excel menu déroulant en cascade - Guide
- Menu démarrer windows 11 - Guide
- Canon quick menu - Télécharger - Utilitaires
2 réponses
Alain_42
Messages postés
5361
Date d'inscription
dimanche 3 février 2008
Statut
Membre
Dernière intervention
13 février 2017
894
10 sept. 2009 à 11:43
10 sept. 2009 à 11:43
Je ne comprend pas ma précédente réponse n'a pas fonctionné, enfin voilà le code que j'ai adapté à ton cas:
<!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" xml:lang="fr" lang="fr">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1"/>
<title>Pays</title>
<script type="text/javascript">
function ajouterOption(id_liste) {
var obj=document.getElementById(id_liste); //liste
option = document.createElement('option'); //Création d'un élément option à ajouter au select.
option.innerHTML = prompt("Valeur a rajouter"); //On lui attribue un contenu visible dans la liste avec le nom du pays de l'utilisateur.
option.value =obj.value.substring(0, 2); //Et une valeur symbolique en utilisant les deux premières lettres du pays.
obj.appendChild(option); //Et enfin on l'ajoute.
}
</script>
</head>
<body>
<form action="" method="post" name="Form_test">
<fieldset>
<select name="liste1" id="liste1">
</select>
<input type="button" value="Ajouter liste1" onClick="ajouterOption('liste1');"/>
</fieldset><fieldset>
<select name="liste2" id="liste2">
</select>
<input type="button" value="Ajouter liste2" onClick="ajouterOption('liste2');"/>
</fieldset><fieldset>
<select name="liste3" id="liste3">
</select>
<input type="button" value="Ajouter liste3" onClick="ajouterOption('liste3');"/>
</fieldset>
</form>
</body>
</html>
phiper78
Messages postés
2
Date d'inscription
mercredi 9 septembre 2009
Statut
Membre
Dernière intervention
11 septembre 2009
10 sept. 2009 à 13:45
10 sept. 2009 à 13:45
Bonjour,
Merci pour cette réponse Alain_42.
En effet le script de siteduzero fonctionne que si un seul menu déroulant est modifiable dans un formulaire.
Encore merci, je teste ton script de suite
Résultat de mon essai :
Une valeur est bien ajoutée dans le menu déroulant affichée. mais il n'est pas possible de récupérer cette valeur dans $_POST.
Je te jois mon code d'essai :
<!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" xml:lang="fr" lang="fr">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1"/>
<title>Essai</title>
<script type="text/javascript">
function ajouterOption(id_liste) {
var obj=document.getElementById(id_liste); //liste
option = document.createElement('option'); //Création d'un élément option à ajouter au select.
option.innerHTML = prompt("Valeur a rajouter"); //On lui attribue un contenu visible dans la liste avec le nom du pays de l'utilisateur.
option.value =obj.value.substring(0, 2); //Et une valeur symbolique en utilisant les deux premières lettres du pays.
obj.appendChild(option); //Et enfin on l'ajoute.
}
</script>
</head>
<body>
<?php
if (isset($_POST['test']) && !empty($_POST['test'])) $action = $_POST['test'];
else $action = 'debut';
switch ($action) {
case 'debut' :
?>
<form method="post" action="./index.php?titre=logistic" name="test">
<fieldset>
<p><label class="float" for="lieu">Nom :</label>
<select name="liste1" id="liste1">
<option value=""></option>
<option value="nom1">Nom1</option>
<option value="nom2">Nom2</option>
<option value="nom3">Nom3</option>
</select>
<input type="button" value="Ajouter liste1" onClick="ajouterOption('liste1');"/>
</p>
<p><label class="float" for="genre">Genre :</label>
<select name="liste2" id="liste2">
<option value=""></option>
<option value="genre1">Genre1</option>
<option value="genre2">Genre2</option>
<option value="genre3">Genre3</option>
<option value="genre4">Genre4</option>
</select>
<input type="button" value="Ajouter liste2" onClick="ajouterOption('liste2');"/>
</p>
<p><label class="float" for="genre">Type :</label>
<select name="liste3" id="liste3">
<option value=""></option>
<option value="type1">Type1</option>
<option value="type2">Type2</option>
<option value="type3">Type3</option>
</select>
<input type="button" value="Ajouter liste3" onClick="ajouterOption('liste3');"/>
</p>
<input type="submit" value="Envoyer" name="test" title="Envoyer" />
</fieldset>
</form>
<?php
break;
case 'Envoyer' :
echo '<p><a href="./index.php">Retour</a></p>';
echo '<pre>'; print_r($_POST); echo '</pre>';
break;
default:
break;
}
?>
</body>
</html>
Merci pour cette réponse Alain_42.
En effet le script de siteduzero fonctionne que si un seul menu déroulant est modifiable dans un formulaire.
Encore merci, je teste ton script de suite
Résultat de mon essai :
Une valeur est bien ajoutée dans le menu déroulant affichée. mais il n'est pas possible de récupérer cette valeur dans $_POST.
Je te jois mon code d'essai :
<!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" xml:lang="fr" lang="fr">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1"/>
<title>Essai</title>
<script type="text/javascript">
function ajouterOption(id_liste) {
var obj=document.getElementById(id_liste); //liste
option = document.createElement('option'); //Création d'un élément option à ajouter au select.
option.innerHTML = prompt("Valeur a rajouter"); //On lui attribue un contenu visible dans la liste avec le nom du pays de l'utilisateur.
option.value =obj.value.substring(0, 2); //Et une valeur symbolique en utilisant les deux premières lettres du pays.
obj.appendChild(option); //Et enfin on l'ajoute.
}
</script>
</head>
<body>
<?php
if (isset($_POST['test']) && !empty($_POST['test'])) $action = $_POST['test'];
else $action = 'debut';
switch ($action) {
case 'debut' :
?>
<form method="post" action="./index.php?titre=logistic" name="test">
<fieldset>
<p><label class="float" for="lieu">Nom :</label>
<select name="liste1" id="liste1">
<option value=""></option>
<option value="nom1">Nom1</option>
<option value="nom2">Nom2</option>
<option value="nom3">Nom3</option>
</select>
<input type="button" value="Ajouter liste1" onClick="ajouterOption('liste1');"/>
</p>
<p><label class="float" for="genre">Genre :</label>
<select name="liste2" id="liste2">
<option value=""></option>
<option value="genre1">Genre1</option>
<option value="genre2">Genre2</option>
<option value="genre3">Genre3</option>
<option value="genre4">Genre4</option>
</select>
<input type="button" value="Ajouter liste2" onClick="ajouterOption('liste2');"/>
</p>
<p><label class="float" for="genre">Type :</label>
<select name="liste3" id="liste3">
<option value=""></option>
<option value="type1">Type1</option>
<option value="type2">Type2</option>
<option value="type3">Type3</option>
</select>
<input type="button" value="Ajouter liste3" onClick="ajouterOption('liste3');"/>
</p>
<input type="submit" value="Envoyer" name="test" title="Envoyer" />
</fieldset>
</form>
<?php
break;
case 'Envoyer' :
echo '<p><a href="./index.php">Retour</a></p>';
echo '<pre>'; print_r($_POST); echo '</pre>';
break;
default:
break;
}
?>
</body>
</html>
