Affichage champs formulaire à condition
yves
-
adns Messages postés 1152 Statut Membre -
adns Messages postés 1152 Statut Membre -
Bonjour à tous !
Je créée un formulaire en php, et je souhaiterai faire un sorte que, par exemple, quand l'élément d'une liste est sélectionné, un champ s'affiche en dessous, et si une autre option est sélectionnée, que ce soit un autre champs par exemple :)
J'ai vu dans mes recherche qu'il y avait une histoire de if
Alors j'ai commencé :
Enfait je ne sais pas comment traduire "Oui est séléectioné" en php ... Merci de votre aide :)
Je créée un formulaire en php, et je souhaiterai faire un sorte que, par exemple, quand l'élément d'une liste est sélectionné, un champ s'affiche en dessous, et si une autre option est sélectionnée, que ce soit un autre champs par exemple :)
J'ai vu dans mes recherche qu'il y avait une histoire de if
Alors j'ai commencé :
<select id="liste_id" name="liste">
<option>Non</option>
<option>Oui</option>
</select>
<input id="champ_id" name="champ">
if (Oui est selectioné) {
document.getElementById("champ_id").style.visibility = "visible"
}
else {
document.getElementById("champ_id").style.visibility = "hidden"
}
Enfait je ne sais pas comment traduire "Oui est séléectioné" en php ... Merci de votre aide :)
A voir également:
- Affichage champs formulaire à condition
- Whatsapp formulaire opposition - Guide
- Formulaire de réclamation facebook compte désactivé - Guide
- Excel cellule couleur si condition texte - Guide
- Affichage double ecran - Guide
- Formulaire de reclamation instagram - Guide
4 réponses
Bonjour,
je suppose que tu veux que cela soit interactif ?
c'est à dire que des que l'on change la valeur du select les champs se mettent à jour ?
Ainsi il te faudra faire du javascript.
La fonction javascript change se base sur la valeur (value) de l'élément sélectionné dans la liste pour afficher ou non le champ.
J'ai donc ajouter l'événement onchange sur la liste qui veut dire a chaque fois que la valeur change.
Ce code est simplement pour t'aider car il est plutôt sale. je te laisse faire quelque recherche pour améliorer tout ca ;)
Adns
je suppose que tu veux que cela soit interactif ?
c'est à dire que des que l'on change la valeur du select les champs se mettent à jour ?
Ainsi il te faudra faire du javascript.
<select id="liste_id" name="liste" onchange="change();">
<option value="non">Non</option>
<option value="oui">Oui</option>
</select>
<input id="champ_id" name="champ">
<script>
function change(){
if (document.getElementById("liste_id").value == "oui") {
document.getElementById("champ_id").style.visibility = "visible"
}
else {
document.getElementById("champ_id").style.visibility = "hidden"
}
}
</script>
La fonction javascript change se base sur la valeur (value) de l'élément sélectionné dans la liste pour afficher ou non le champ.
J'ai donc ajouter l'événement onchange sur la liste qui veut dire a chaque fois que la valeur change.
Ce code est simplement pour t'aider car il est plutôt sale. je te laisse faire quelque recherche pour améliorer tout ca ;)
Adns
bonjour,
tu doit taper:
if (lenomdetacase == on)
{
document.getElementById("champ_id").style.visibility = "visible
}
else (lenomdetacase == off)
{
document.getElementById("champ_id").style.visibility = "hidden"
}
tu doit taper:
if (lenomdetacase == on)
{
document.getElementById("champ_id").style.visibility = "visible
}
else (lenomdetacase == off)
{
document.getElementById("champ_id").style.visibility = "hidden"
}
Bonsoir ! Merci beaucoup pour vos réponses !
adns, j'ai essayer ta methode, cela fonctionne ! Oui mais ...Cela ne fonctionne que si on deroule le menu et selectionne l'option. Cela ne fonctionne pas avec l'option pré selectionner de la liste :s
Comment faire pour que tout les champs soit caché à l'ouverture de la page, et faire en sorte que seuls les bons champs apparaissent quand on selectionne la valeur concerné ?
D'avance merci, pour votre aide précieuse ! :)
adns, j'ai essayer ta methode, cela fonctionne ! Oui mais ...Cela ne fonctionne que si on deroule le menu et selectionne l'option. Cela ne fonctionne pas avec l'option pré selectionner de la liste :s
Comment faire pour que tout les champs soit caché à l'ouverture de la page, et faire en sorte que seuls les bons champs apparaissent quand on selectionne la valeur concerné ?
D'avance merci, pour votre aide précieuse ! :)
Ça marche implacable merci ! :)
Dit moi, autre chose, comment faire quand le menu select comporte 3 options ?
J'ai essayer de rajouter un <script> dans ma page mais sa annule tout ...
Il n'y aurai pas une histoire de nom de fonctions appelées ou quelque chose de ce genre ? :)
D'avance merci pour tes précieuses explications ! ;)
Dit moi, autre chose, comment faire quand le menu select comporte 3 options ?
J'ai essayer de rajouter un <script> dans ma page mais sa annule tout ...
Il n'y aurai pas une histoire de nom de fonctions appelées ou quelque chose de ce genre ? :)
D'avance merci pour tes précieuses explications ! ;)
Il te suffit de modifier le corps de la fonction change. je t'ai fourni un exemple assez minimaliste et je vais continuer. a toi de te documenter un peu et de modifier le code pour obtenir ce que tu souhaites :)
Adns
if (document.getElementById("liste_id").value == "oui") {
document.getElementById("champ_id").style.visibility = "visible"
}
else if (document.getElementById("liste_id").value == "peutetre"){
document.getElementById("champ_id").style.visibility = "hidden"
}else {
document.getElementById("champ_id").style.visibility = "hidden"
}
Adns
