formulaire web avec upload de fichier

olivier1209 · 31/05/2011, 19h05

Bonsoir tout le monde,

j'ai mon formulaire qui commence à prendre forme, toutefois il n'est pas totalement fini : j'aimerais avoir un seul bouton "Envoyer" plutôt que 3 (2 pour mes upload de fichier, puis le bouton final). J'aimerais garder celui en bas de page, et enlever les 2 autres précédents. Ainsi je peux choisir 2 fichiers à uploader, écrire mon texte, etc.. et cliquer sur "Envoyer", tout en bas de la page. Suis-je assez clair et si oui est-ce possible ?

Mon formulaire web :

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
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title>Config File</title>
<SCRIPT language="Javascript">
function Affiche_sources_yes(){
div_sources.style.visibility="visible";
 
}
function Affiche_sources_no(){
div_sources.style.visibility="hidden";
 
}
 
function Affiche_doc_yes(){
div_doc.style.visibility="visible";
 
}
function Affiche_doc_no(){
div_doc.style.visibility="hidden";
 
}
 
</SCRIPT>
 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
input, textarea
{
font-family:"Times New Roman", Times, serif; /* police du texte tap?'int?eur des champs */
}
 
input:focus, textarea:focus /* Quand le curseur est sur un champ (ne marche pas sur IE) */
{
background-color:#FFFF99;
}
 
label
{
color:blue;
}
 
legend /* On met en valeur les titres des fieldset */
{
font-family:Arial, "Arial Black", Georgia, "Times New Roman", Times, serif;
color:#F8971D;
font-weight:bold;
}
 
fieldset
{
margin-bottom:15px; /* Une marge pour s?rer les fieldset */
background-color:#FFFFCC;
}
 
 
 
</style>
 
</head>
 
<body>
 
<fieldset>
 
 
<center>
<img src=".\logo.jpg" height="49" width="160"  >
</center>
 
</fieldset>
 
<form method="POST" action="upload.php">
 
<fieldset>
 
<legend>Application "Test"</legend>
 
 
<table width="500" border="0" align="center" cellpadding="0" cellspacing="1" bgcolor="#CCCCCC">
<tr>
 
</tr>
</table>
<br>
 
 
<label for="infos">Do you have the setup file ?
</label>
 
 
<br/>
 
<p>
<input type="radio" name="sources" value="yes" id="yes" tabindex="40" onClick="Affiche_sources_yes();"/> <label for="">yes</label><br />
<input type="radio" name="sources" value="no" id="no" tabindex="70" onClick="Affiche_sources_no();" /> <label for="">no</label><br />
</p>
 
 
 
 
<div id="div_sources" style="visibility:hidden">
 
 
<form name="sendfile" method="POST" ENCTYPE="multipart/form-data" action="upload.php">
 <input type="hidden" name="MAX_FILE_SIZE" value="30000000"> 
<p>Setup File : 
<input type="file" name="file" size="20"> 
</p> 
<input type="submit" value="Send" name="send"> 
</form> 
 
 
 
</div>
</fieldset>
 
<fieldset>
 
<label for="infos">Would you have some information to provide about this application ? (Install Guideline or anything else)
</label>
 
 
<br/>
 
<p>
<input type="radio" name="sources" value="yes" id="yes" tabindex="40" onClick="Affiche_doc_yes();"/> <label for="">yes</label><br />
<input type="radio" name="sources" value="no" id="no" tabindex="70" onClick="Affiche_doc_no();" /> <label for="">no</label><br />
</p>
 
<div id="div_doc" style="visibility:hidden">
 
 
 <input type="hidden" name="MAX_FILE_SIZE" value="30000000"> 
<p>Install guideline : 
<input type="file" name="guideline" size="20"> 
</p>
<input type="submit" value="Send" name="send"> 
</form> 
 
</div>
 
 
 
</fieldset>
 
<fieldset>
 
<label for="infos">Would you have any other information to provide ? (license key, the person that might use this application, or anything else..)
</label>
 
<br>
<TEXTAREA name="information" rows=10 COLS=40></TEXTAREA>
 
 
 
</fieldset>
 
 
 
<p>
<input type=submit value=Send> 
 
</p>
 
 
</form>
 
 
</body>
 
</html>

Merci pour votre aide

andry.aime · 31/05/2011, 19h20

Bonsoir,

Ta structure HTML n'est pas correct, tu ne dois pas avoir de balise form imbriqué dans une balise form. Utilise une seule form pour ton formulaire.

A+.

olivier1209 · 31/05/2011, 21h21

mais pour chaque upload de fichier j'ai une balise <form> </form>

jreaux62 · 31/05/2011, 21h25

Bonjour,

Citation:

Envoyé par olivier1209

mais pour chaque upload de fichier j'ai une balise <form> </form>

Pour quoi faire ? C'est inutile.

Code :

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

1
2
3
4
5
<form method="POST" enctype="multipart/form-data" action="upload.php">
 
...
 
</form>

(au debut et a la fin)
Tout le traitement se fera en meme temps dans upload.php

olivier1209 · 31/05/2011, 23h10

ok merci j'avance sur ça demain je vous tiens au courant

stealth35 · 31/05/2011, 23h17

Essaye de valider ta page aussi, la ça pique les yeux
http://validator.w3.org/

olivier1209 · 01/06/2011, 00h47

Citation:

Envoyé par stealth35

Essaye de valider ta page aussi, la ça pique les yeux
http://validator.w3.org/

Merci pour le lien

J'ai mon formulaire qui tient la route et qui parle bien avec le script php qui "vient dérière"...
Toutefois, j'ai l'impression que je suis limité en terme de taille d'upload en http

En effet j'aimerais pouvoir uploader de gros fichier d'installation (plusieurs Mo), et j'aimerais éviter la case serveur FTP lol.
des idées ?

stealth35 · 01/06/2011, 01h15

tout est dans la doc :
http://php.net/manual/fr/features.file-upload.php

olivier1209 · 01/06/2011, 08h57

Citation:

Envoyé par stealth35

tout est dans la doc :
http://php.net/manual/fr/features.file-upload.php

Merci pour la réponse j'ai changé la conf du php.ini dans /etc/php5/apache2/

J'ai un dernier petit problème, je n'arrive pas à uploader mes 2 fichiers en même temps (je clique sur submit une fois, j'arrive sur le script php (le fichier d'install a bien été uploadé), et ensuite je reviens sur ma page d'accueil, je reclique sur submit. Cette fois le 2 fichier (guideline) s'upload correctement.
Savez-vous pourquoi ?

Qui dit un clique dit un seul upload ?

Si oui il me faudrait une petite astuce (javascript history (-1) pour revenir en arrière , ...)
Des idées ?

jreaux62 · 01/06/2011, 10h06

Bonjour,
remets-nous ton code "au propre" ...

olivier1209 · 01/06/2011, 13h04

Citation:

Envoyé par jreaux62

Bonjour,
remets-nous ton code "au propre" ...

Je l'ai un peu arrangé :

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
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title>Config File</title>
<SCRIPT language="Javascript">
 
function Affiche_sources_yes(){
div_sources.style.visibility="visible";
 
}
function Affiche_sources_no(){
div_sources.style.visibility="hidden";
 
}
 
function Affiche_doc_yes(){
div_doc.style.visibility="visible";
 
}
function Affiche_doc_no(){
div_doc.style.visibility="hidden";
 
}
 
</SCRIPT>
 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
 
input, textarea
{
font-family:"Times New Roman", Times, serif; 
}
 
input:focus, textarea:focus (ne marche pas sur IE) 
{
background-color:#FFFF99;
}
 
label
{
color:blue;
}
 
legend 
{
font-family:Arial, "Arial Black", Georgia, "Times New Roman", Times, serif;
color:#F8971D;
font-weight:bold;
}
 
fieldset
{
margin-bottom:15px; 
background-color:#FFFFCC;
}
</style>
</head>
 
 
<body>
 
<form name="sendfile" method="POST" ENCTYPE="multipart/form-data" action="upload.php"> 
 
<fieldset>
<center>
<img src="./logo_appdna.jpg" height="49" width="160"  >
</center>
</fieldset>
 
 
<fieldset>
<label for="email">Please confirm your email adress [Important]</label>
<br>
<INPUT type=text name="email">
</fieldset>
 
 
<fieldset>
<legend>Application "Test"</legend>
 
 
<table width="500" border="0" align="center" cellpadding="0" cellspacing="1" bgcolor="#CCCCCC">
</table>
 
 
<br>
<label for="infos">Would you have the setup file ?
</label>
<br/>
 
 
<p>
<input type="radio" name="sources" value="yes" id="yes" tabindex="40" onClick="Affiche_sources_yes();"/> <label for="">yes</label><br />
<input type="radio" name="sources" value="no" id="no" tabindex="70" onClick="Affiche_sources_no();" /> <label for="">no</label><br />
</p>
 
 
<div id="div_sources" style="visibility:hidden">
<p>Setup File : 
<input type="file" name="file" size="20"> 
</p>
</div>
 
 
</fieldset>
 
<fieldset>
<label for="infos">Would you have some information to give about this application ? (Install Guideline or anything else)
</label>
 
<br/>
 
<p>
<input type="radio" name="sources" value="yes" id="yes" tabindex="40" onClick="Affiche_doc_yes();"/> <label for="">yes</label><br />
<input type="radio" name="sources" value="no" id="no" tabindex="70" onClick="Affiche_doc_no();" /> <label for="">no</label><br />
</p>
 
 
<div id="div_doc" style="visibility:hidden">
<p>Install guideline : 
<input type="file" name="guideline" size="20"> 
</p>
</div>
 
 
</fieldset>
 
 
 
<fieldset>
<label for="infos">Would you have any other information to provide ? (license key, the person that might use this application, or anything else..)
</label>
 
<br>
<TEXTAREA name="information" rows=10 COLS=40></TEXTAREA>
 
</fieldset>
 
<p>
<input type=submit value=Submit> 
</p>
 
</form>
 
</body>
</html>

Si je le passe dans le site http://validator.w3.org mes balises <div> ne sont plus prises en compte et mon choix optionel oui/non ne fonctionne plus

Des idées pour faire un upload de fichiers multiples ?

stealth35 · 01/06/2011, 13h36

Citation:

Envoyé par olivier1209

Si je le passe dans le site http://validator.w3.org mes balises <div> ne sont plus prises en compte et mon choix optionel oui/non ne fonctionne plus

c'est a toi de bien coder
pour le multi upload il faut faire un tableau pour le champs name :
name="file[]"

jreaux62 · 01/06/2011, 13h45

Voila à quoi devrait ressembler un "code propre" :

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
<form name="sendfile" method="POST" enctype="multipart/form-data" action="./upload.php"> 
<fieldset style="text-align:center;">
	<img src="./logo_appdna.jpg" height="49" width="160"  alt="" />
	<!-- balise alt obligatoire !! -->
</fieldset>
 
<fieldset>
	<label for="idemail">Please confirm your email adress [Important]</label>
	<input type="text" id="idemail" name="email" />
	<!-- ne pas oublier les "" et le / a la fin !! -->
	<!-- le for= se rapporte à id= (et pas a name=) -->
</fieldset>
<fieldset>
	<legend>Application "Test"</legend>
 
	<!-- A QUOI peut bien servir cette table ??? ->
	<table width="500" border="0" align="center" cellpadding="0" cellspacing="1" bgcolor="#CCCCCC">
	</table>
	<p>
		<label for="">Would you have the setup file ?</label><br />
		<input type="radio" name="sources" value="yes" id="yes" tabindex="40" onClick="Affiche_sources_yes();"/> <label for="">yes</label><br />
		<input type="radio" name="sources" value="no" id="no" tabindex="70" onClick="Affiche_sources_no();" /> <label for="">no</label>
	</p>
	<p id="div_sources" style="visibility:hidden">Setup File : 
		<input type="file" id="idfile" name="file" size="20" /> 
	<!-- ne pas oublier les "" et / a la fin -->
	</p>
</fieldset>
<fieldset>
	<p>
		<label for="">Would you have some information to give about this application ? (Install Guideline or anything else)</label>
 		<br/>
		<input type="radio" name="sources" value="yes" id="yes" tabindex="40" onClick="Affiche_doc_yes();"/> <label for="">yes</label><br />
		<input type="radio" name="sources" value="no" id="no" tabindex="70" onClick="Affiche_doc_no();" /> <label for="">no</label><br />
	</p>
	<p id="div_doc" style="visibility:hidden">
		<label for="idguideline">Install guideline : </label>
		<input type="file" id="idguideline" name="guideline" size="20" /> 
	<!-- ne pas oublier les "" et / a la fin -->
	</p>
</fieldset>
<fieldset>
	<label for="">Would you have any other information to provide ? (license key, the person that might use this application, or anything else..)</label><br />
	<textarea id="idinformation" name="information" rows="10" cols="40"></textarea>
</fieldset>
<p>
	<input type="submit" value="Submit" /> 
	<!-- ne pas oublier les "" et / a la fin -->
</p>
</form>

et remplace <SCRIPT language="Javascript">...</SCRIPT>
par :

Code :

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

1
2
3
<script type="text/javascript">
...
</script>

olivier1209 · 01/06/2011, 14h01

Citation:

Envoyé par jreaux62

Voila à quoi devrait ressembler un "code propre"

Merci bien

Pour l'upload de fichiers multiples j'ai testé ça :
pour mon premier fichier (et pour en l'occurence récupérer son nom) :

Code :

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

$_FILES["file"]["name"][0];

pour le deuxième :

Code :

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

$_FILES["file"]["name"][1];

sans succès

andry.aime · 01/06/2011, 14h08

Tu n'as qu'à utiliser un boucle foreach.
Regarde l'exemple 3 ici.

A+.

31/05/2011, 23h17	#6
stealth35 Modérateur Inscription : septembre 2010 Messages : 7 103 Détails du profil Informations forums : Inscription : septembre 2010 Messages : 7 103 Points : 8 466 Points : 8 466	Essaye de valider ta page aussi, la ça pique les yeux http://validator.w3.org/ __________________ http://blog.stealth35.com/
	00

01/06/2011, 01h15	#8
stealth35 Modérateur Inscription : septembre 2010 Messages : 7 103 Détails du profil Informations forums : Inscription : septembre 2010 Messages : 7 103 Points : 8 466 Points : 8 466	tout est dans la doc : http://php.net/manual/fr/features.file-upload.php __________________ http://blog.stealth35.com/
	00

01/06/2011, 10h06	#10
jreaux62 Rédacteur Jérôme Réaux Webdesigner Inscription : août 2008 Messages : 2 993 Détails du profil Informations personnelles : Nom : Jérôme Réaux Âge : 45 Localisation : France, Pas de Calais (Nord Pas de Calais) Informations professionnelles : Activité : Webdesigner Secteur : Arts - Culture Informations forums : Inscription : août 2008 Messages : 2 993 Points : 5 786 Points : 5 786	Bonjour, remets-nous ton code "au propre" ... __________________ "Ce qui se conçoit bien s'énonce clairement - Et les mots pour le dire arrivent aisément." Nicolas Boileau-Despréaux, Homme de lettres français (1636-1711), principal théoricien de l'esthétique classique. Site perso Mes tutos DVP : Gestion-Affichage de Nouvelles - Affichage en tableau HTML - Fonctions de redimensionnement d'images
	00

31/05/2011, 19h20	#2
andry.aime Rédacteur/Modérateur Andry Aimé Inscription : septembre 2007 Messages : 5 128 Détails du profil Informations personnelles : Nom : Andry Aimé Localisation : Ile Maurice Informations forums : Inscription : septembre 2007 Messages : 5 128 Points : 7 270 Points : 7 270	Bonsoir, Ta structure HTML n'est pas correct, tu ne dois pas avoir de balise form imbriqué dans une balise form. Utilise une seule form pour ton formulaire. A+.
	00

31/05/2011, 21h21	#3
olivier1209 Futur Membre du Club Inscription : novembre 2006 Messages : 128 Détails du profil Informations personnelles : Âge : 24 Informations forums : Inscription : novembre 2006 Messages : 128 Points : 16 Points : 16	mais pour chaque upload de fichier j'ai une balise <form> </form>
	00

31/05/2011, 23h10	#5
olivier1209 Futur Membre du Club Inscription : novembre 2006 Messages : 128 Détails du profil Informations personnelles : Âge : 24 Informations forums : Inscription : novembre 2006 Messages : 128 Points : 16 Points : 16	ok merci j'avance sur ça demain je vous tiens au courant
	00

01/06/2011, 14h08	#15
andry.aime Rédacteur/Modérateur Andry Aimé Inscription : septembre 2007 Messages : 5 128 Détails du profil Informations personnelles : Nom : Andry Aimé Localisation : Ile Maurice Informations forums : Inscription : septembre 2007 Messages : 5 128 Points : 7 270 Points : 7 270	Tu n'as qu'à utiliser un boucle foreach. Regarde l'exemple 3 ici. A+.
	00

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email