Ajouter un champ dans un formulaire (classique)

**psgman113** · 07/05/2007, 15h11

Bonjour,
j'ai un formulaire qui a pour nom form1 et je voudrais rajouter un champ si j'ai cliqué sur un bouton radio. J'ai donc utilisé une fonction de javascript qui me submit le formulaire sans que j'ai à appuyer sur le button valider .

Dans mon formulaire, j'ai testé l'existence de la variable POST associé au champ input de mon radio box. S'il existe, alors j'affiche mon champ (qui est un champ de type file pour upload un fichier), sinon je ne l'affiche pas.

Mais , quans je coche la radio box , rien ne se passe.

Voici mon code

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
 
echo"
<form name='formu1' action='".$action_form."' method='post' >
 <label for='icone'> </icone>
  <table border='0'>
<TR><th  ><B>Numéro</B></th> <th>
<input type='text' size='7' name='numero' value='".$numero."'></th></TR>
 
 
<TR  ><th>
Voulez vous upload un fichier?</th>
<th><input type='checkbox' name='nocturne' onclick='javascript: window.document.forms['formu1'].submit();'";
if (isset($_POST['nocturne'])) echo 'checked'; 
 
echo '>Oui';					
if (isset($_POST['nocturne'])) echo " <TR  ><th ALIGN='LEFT' COLSPAN='2'>
<input type='file' name='file' size='20'  onchange='javascript: window.document.forms['formu1'].submit();' > </th> </tr>
 
<TR><th ALIGN='center'  COLSPAN=2><font size='5'>
<p align='center'> <input class='button' type='submit' value='Valider' style='font:Verdana,Helvetica;font-size: 17px;background-color:#FFFFFF;color: #3B46BF;'> 
<input class='button' type='reset' value='Effacer' style='font:Verdana,Helvetica;font-size: 17px;background-color:#FFFFFF;color: #3B46BF;'> </p>
 
 
 
</th></TR>
 
</table>
 
 
</form>";

Merci

**Ouach** · 07/05/2007, 21h32

En l'occurence, tu utilises un language à contre emploi. Pour schématiser, le javascript c'est pour tout ce qui concerne le client, le php c'est pour tout ce qui se passe sur le serveur. Or ici tu utilises le php pour faire un boulot typiquement sur le client. Utilise le javascript plutôt. D'ailleur que se passe-t-il quand tu cliques sur le bouton submit? Rien surement...
Quelques pistes:
Une balise de type input a un attribut qui s'appelle "visibility".
Il est possible, en javascript, de changer cet attribut en cliquant sur un input de type checkbox.

**psgman113** · 08/05/2007, 01h06

MErci bien

voici mon code pour les intéressés

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
 
 
<script language="javascript" type="text/javascript"> 
 
function ModifChamp()
{
	if (document.forms["form1"].checkbox.checked)
	{
		document.forms["form1"].champ_text.value='Bouton coché'
				document.forms["form1"].fichier.type='file'
 
 
	}
	else
	{
		document.forms["form1"].champ_text.value='bouton non coché'
						document.forms["form1"].fichier.type='hidden'
 
	}
}
</script>
<title>Untitled Document</title>
</head>
 
<body>
 
<form name="form1">
<br><input type="checkbox" name="checkbox" onClick="ModifChamp();return true;">
<br><input type='TEXT' name='champ_text' value='Essai du javascript' size='24'>
<br><input type='hidden' name='fichier' size='20'>
 
 
</form>
</body>
</html>

**Ouach** · 08/05/2007, 09h03

Et? Ca fonctionne? Il n'y a pas de bouton submit. Quand tu sélectionnes ta case à cocher, n'as tu pas une erreur à cause du changement de type?
Au lieu de changer le type pourquoi ne changerais-tu pas la visibilité?
Quelque chose comme : (Attention, je n'ai pas testé, c'est le principe que j'énonce ici)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
 
 
<script language="javascript" type="text/javascript"> 
 
function ModifChamp()
{
	if (document.forms["form1"].checkbox.checked)
	{
		document.forms["form1"].champ_text.value='Bouton coché';
		document.getElementById("fichier").style.visibility='visible';
 
 
	}
	else
	{
		document.forms["form1"].champ_text.value='bouton non coché';
		document.getElementById("fichier").style.visibility='hidden';
 
	}
}
</script>
<title>Untitled Document</title>
</head>
 
<body>
 
<form name="form1">
  <input type="checkbox" name="checkbox" onClick="ModifChamp();return true;">
  <br><input type='TEXT' name='champ_text' value='Essai du javascript' size='24'>
  <br><input type='file' id="fichier" name='fichier' size='20'>
</form>
</body>
</html>

**psgman113** · 08/05/2007, 16h31

En effet, il y avait une erreur sous le navigateur internet explorer mais ma méthode marchait sur mozzilla firefox,

ta méthode marche que sur internet explorer , il faut juste rajouter dans le code du formulaire concernant le champ fichier

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

style="visibility: hidden"

**psgman113** · 09/05/2007, 11h09

Quelqu'un a t'il une solution qui marche sous internet explorer et mozilla firefox?

Merci

**Ouach** · 09/05/2007, 21h28

1 Qu'est-ce qui se passe? Pourquoi cela ne fonctionne pas?
2 Peux-tu mettre le code?

**psgman113** · 10/05/2007, 11h23

Bonjour,
sous ie , mon champ parcourir apparait quand je clique sur le bouton radio
tandis que sous mozilla, il n'apparait pas .

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
 <script language="javascript" type="text/javascript"> 
 
function ModifChamp1()
{
if (document.forms["form1"].checkbox1.checked)
	{
		document.getElementById("file1").style.visibility='visible';
 
 
	}
	else
	{
		document.getElementById("file1").style.visibility='hidden';
 
	}
	}
 </script> 
 
<title>Untitled Document</title>
</head>
 
<body>
 
 
<?php
 
 
echo"
<form name='form1' action='recupfiletest.php' method='post'   onsubmit='return validation();'>

  <table border='1' cellpadding='3' cellspacing='1' align='center'  >

<TR  ><th ALIGN='center'>
Voulez vous upload un fichier?</th>
<th>Oui<input type='checkbox'  name='checkbox1' onClick='ModifChamp1();return true;'>
<input type='file1' style='visibility: hidden' name='file1'  size='20'></th></tr> 

<TR><th ALIGN='center'  COLSPAN=2><font size='5'>
<p align='center'> <input class='button' type='submit' value='Valider' style='font:Verdana,Helvetica;font-size: 17px;background-color:#FFFFFF;color: #3B46BF;'> 
<input class='button' type='reset' value='Effacer' style='font:Verdana,Helvetica;font-size: 17px;background-color:#FFFFFF;color: #3B46BF;'> </p>
</table>

</form>";
?>
 
 
</body>
</html>

**Ouach** · 12/05/2007, 22h38

Essaie ceci:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
 <script language="javascript" type="text/javascript"> 
function ModifChamp1()
{
  if (document.getElementById("checkbox1").checked)
	{
		document.getElementById("file1").style.visibility='visible';
	}
	else
	{
		document.getElementById("file1").style.visibility='hidden';
	}
}
 </script> 
 
<title>Untitled Document</title>
</head>
 
<body>
<form name='form1' action='recupfiletest.php' method='post'   onsubmit='return validation();'>
 
  <table border='1' cellpadding='3' cellspacing='1' align='center'  >
 
<TR  ><th ALIGN='center'>
Voulez vous upload un fichier?</th>
<th>Oui<input type='checkbox'  id='checkbox1'  name='checkbox1' onClick='ModifChamp1();'>
<input type='file1' style='visibility: hidden' id='file1' name='file1'  size='20'></th></tr> 
 
<TR><th ALIGN='center'  COLSPAN=2>
<p align='center'> <input class='button' type='submit' value='Valider' style='font:Verdana,Helvetica;font-size: 17px;background-color:#FFFFFF;color: #3B46BF;'> 
<input class='button' type='reset' value='Effacer' style='font:Verdana,Helvetica;font-size: 17px;background-color:#FFFFFF;color: #3B46BF;'> </p>
</th></tr></table>
 
</form>
</body>
</html>

**psgman113** · 14/05/2007, 17h21

Merci

Ajouter un champ dans un formulaire (classique)

Langage PHP

Vue hybride

Discussions similaires

Partager

Partager