Eléments de formulaires et options supplémentaires

Sujet résolu

18 octobre 2006 à 14:46:54

Bonjour,

je suis actuellement en train de coder un générateur de commandes graphiques pour un forum auquel j'appartiens et j'ai donc un formuaire parmi lequel il y a des éléments d'options (cases à cocher et listes déroulantes). Ce que j'aimerais faire, c'est selon l'élément d'option choisi (par exemple un élement de la liste déroulante ou une des cases à cocher), j'ai un autre élément de formulaire (par exemple zone de texte) qui apparaisse. Comment puis-je faire cela ?

Merci de vos réponses

"Striker : Surely you can't be serious. Rumack : I am serious... and don't call me Shirley."

Anonyme

18 octobre 2006 à 15:50:25

Salut.

C'est surement possible en JavaScript.
Quand une checkbox est cochée, le script affiche la zone de formulaire (avec document.write('<input type....>'))

Tristou

18 octobre 2006 à 16:44:59

Merci de ta réponse

Peux-tu (ou si tu en sais pas quelqu'un qui saurait) me dire ce qu'il faut noter exactement pour qu'avec telle condition, on affiche le champ avec document.write()

Merci d'avance

"Striker : Surely you can't be serious. Rumack : I am serious... and don't call me Shirley."

strucky

18 octobre 2006 à 17:16:12

Je me goure peut-être, mais avec document.write, je ne pense pas que ça puisse marcher, puisque si tu valides ton form, les champs écrits en js ne seront pas dans la source.

Plutôt en mettant display none, sur les blocs, et si un checkbox est coché, tu passes le bloc e display bloc ou inline.

Tristou

18 octobre 2006 à 17:30:34

Je n'ai pas compris

"Striker : Surely you can't be serious. Rumack : I am serious... and don't call me Shirley."

strucky

18 octobre 2006 à 17:48:26

Un exemple:

Tristou

18 octobre 2006 à 18:08:51

Voilà mon code, j'aimerais avoir une zone de texte en plus si la personne clique sur 'autre demande de création' pour la nature de la création et 'autre' pour la taille (je pense que tu as saisi

)
Que puis-je concrètement ajouter comme code ?

<div id="corps">
<h2>Sélectionnez vos options</h2>

<strong>Nature de la création :</strong>
   <form method="post" action="generateur.php">
<p><select name="creation">
<option value="banniere">Bannière</option>
<option value="logo">Logo</option>
<option value="avatar">Avatar</option>
<option value="signature">Signature</option>
<option value="animation">Animation flash</option>
<option value="boutons">Boutons</option>
<option value="icones">Icônes</option>
<option value="themes">Thèmes complets</option>
   <option value="autre">Autres demandes de créations</option>
</select></p>
<strong>Taille de la création :</strong><br/>
<em>Les tailles sont données à titre indicatif</em> - <a href="http://forum.forumactif.com/viewtopic.forum?t=16550">aperçu des tailles</a>
<p><select name="taille">
<option value="88-31">88*31 pixels</option>
<option value="468-60">468*60 pixels</option>
<option value="85*25">85*25 pixels</option>
<option value="120-40">120*40 pixels</option>
<option value="100*100">100*100 pixels</option>
<option value="150-200">150*200 pixels</option>
<option value="500-100">500*100 pixels</option>
<option value="600-150">600*150 pixels</option>
   <option value="autre">Autre</option>
</select></p>
</div>

"Striker : Surely you can't be serious. Rumack : I am serious... and don't call me Shirley."

strucky

18 octobre 2006 à 18:11:06

Euh, mais je t'ai montré l'idée, c'est à toi d'adapter à ta page.

Si tu n'y arrive pas dis le.

Tristou

18 octobre 2006 à 18:28:03

En effet je n'y arrive pas parce que je ne comprends pas tout le script en fait.
J'ai essayé de voir ce que ça donnait en supprimant ça :

<p>cliquez <input type="checkbox" id="check" onclick="suivant('check', 'bloc')" /></p>
<p style="display: none" id="bloc">En trez l'information <input type="text" /></p>

(supprimer l'un ou l'autre des paragraphes)
J'ai aussi essayer de modifier la condition en haut en mettant ( box.select) mais ça ne marche pas donc je ne sais pas...

EDIT: ah j'ai compris un truc, quand je clique sur la zone de texte, une deuxième apparait. Ce qu'il me faudrait c'est que ça soit la liste déroulante... vais essayer un truc.

"Striker : Surely you can't be serious. Rumack : I am serious... and don't call me Shirley."

strucky

18 octobre 2006 à 19:00:20

Ah j'ai pas fait gaffe que c'était avec un select.

Tiens une solution :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-15">
<meta name="generator" content="PSPad editor, www.pspad.com">
<title></title>
<script type="text/javascript">
function autre(select, text, value)
{
var select = document.getElementById(select);
var text = document.getElementById(text);

if(select.options[select.selectedIndex].value == value )
{
text.style.display="inline";
}
else
{
text.style.display="none";
}
}
</script>
</head>
<body>
<div id="corps">
<h2>Sélectionnez vos options</h2>

<strong>Nature de la création :</strong>
<form method="post" action="generateur.php">
<p><select name="creation" id="creation" onchange="autre('creation', 'bloc', 'autre')">
<option value="banniere">Bannière</option>
<option value="logo">Logo</option>
<option value="avatar">Avatar</option>
<option value="signature">Signature</option>
<option value="animation">Animation flash</option>
<option value="boutons">Boutons</option>
<option value="icones">Icônes</option>
<option value="themes">Thèmes complets</option>
<option value="autre">Autres demandes de créations</option>
</select> <span style="display: none" id="bloc"> indiquez : <input type="text" /></span></p>

<strong>Taille de la création :</strong><br/>
<em>Les tailles sont données à titre indicatif</em> - <a href="http://forum.forumactif.com/viewtopic.forum?t=16550">aperçu des tailles</a>
<p><select name="taille">
<option value="88-31">88*31 pixels</option>
<option value="468-60">468*60 pixels</option>
<option value="85*25">85*25 pixels</option>
<option value="120-40">120*40 pixels</option>
<option value="100*100">100*100 pixels</option>
<option value="150-200">150*200 pixels</option>
<option value="500-100">500*100 pixels</option>
<option value="600-150">600*150 pixels</option>
<option value="autre">Autre</option>
</select></p>
</div>
</body>
</html>

Tristou

18 octobre 2006 à 20:06:32

Yes ça marche merci beaucoup

Donc à chaque fois que j'ai un choix qui demande qu'il y ait une zone de texte, j'ai juste à mettre ça :

<span style="display: none" id="bloc"> précisez : <input type="text" /></span>

"Striker : Surely you can't be serious. Rumack : I am serious... and don't call me Shirley."

strucky

18 octobre 2006 à 20:41:02

Oui, et le onchange sur le select.

Tristou

19 octobre 2006 à 20:53:41

Bonsoir,

pour les tailles, cela ne marche pas, rien ne se produit.
J'ai essayé d'ajouter le même code que pour les créations (le onchange et la zone de texte) et une seconde fois en remplacçant creation par taille mais rien n'y fait

"Striker : Surely you can't be serious. Rumack : I am serious... and don't call me Shirley."

strucky

19 octobre 2006 à 20:58:30

Montre ce que tu as fait.

Tristou

19 octobre 2006 à 21:32:50

<p><select name="taille" id="taille" onchange="autre('taille', 'bloc', 'autre')">
<option value="88*31 pixels">88*31 pixels</option>
<option value="468*60 pixels">468*60 pixels</option>
<option value="85*25 pixels">85*25 pixels</option>
<option value="120*40 pixels">120*40 pixels</option>
<option value="100*100 pixels">100*100 pixels</option>
<option value="150*200 pixels">150*200 pixels</option>
<option value="500*100 pixels">500*100 pixels</option>
<option value="600*150 pixels">600*150 pixels</option>
<option value="Autre">Autre</option>
</select><span style="display: none" id="bloc"> précisez : <input type="text"name="plus" class="precision" /></span></p>

Voilà

"Striker : Surely you can't be serious. Rumack : I am serious... and don't call me Shirley."

strucky

19 octobre 2006 à 21:40:07

Un id ne doit-être présent qu'une seule fois dans une page.

bloc existe déjà.
Et le value est avec un A majuscule.

<p><select name="taille" id="taille" onchange="autre('taille', 'bloc2', 'Autre')">
<option value="88*31 pixels">88*31 pixels</option>
<option value="468*60 pixels">468*60 pixels</option>
<option value="85*25 pixels">85*25 pixels</option>
<option value="120*40 pixels">120*40 pixels</option>
<option value="100*100 pixels">100*100 pixels</option>
<option value="150*200 pixels">150*200 pixels</option>
<option value="500*100 pixels">500*100 pixels</option>
<option value="600*150 pixels">600*150 pixels</option>
<option value="Autre">Autre</option>
</select><span style="display: none" id="bloc2"> précisez : <input type="text" name="plus" class="precision" /></span></p>

Tristou

19 octobre 2006 à 22:03:22

C'est géant ! Merci beaucoup ça marche

"Striker : Surely you can't be serious. Rumack : I am serious... and don't call me Shirley."