formulaire + PHP + JS

**psylo24** · 01/04/2016, 11h59

Bonjour tout le monde,

Me revoilà encore une fois avec de nouvelles problématiques ^^

En effet je suis sur un mini projet qui consiste à faire un portail web pour répertorier les moulins dans mon département (pour mon asso).
Mon portail permet d’ajouter des moulins dans la BDD, des le modifier, supprimer ect…

Mon problème est que sur la page d’édition d’un moulin (donc un form) j’ai voulu y ajouter un bout de code pour ajouter des photos à mon moulin j’ai donc trouvé un code bien sympa : dispo ici

De ce fait sur la page d’édition de moulin, j’ai rajouté un second form (après le 1er qui me charge les champs de la BDD) et ca m’upload bien mes fichier sur le serveur.

Moi ce que je veux c’est tout avoir dans un seul formulaire et quand je valide ca fasse appel à mon fichier action.php dans la section action=edit mais quand je fais ca, ca ne m’upload pas la photo…
Je pense que le problème est dans le fichier JS mais je ne vais pas vous cacher que je n’y comprends strictement rien…

Mon formulaire edit.php avec 2 form :

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
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
<?php
	//Definition des variables (pour enlever les erreurs dans les logs)
	define('Nom', 'Nom');
	define('IDCommune', 'IDCommune');
	define('IDCourEau', 'IDCourEau');
	define('NbrRVert', 'NbrRVert');
	define('CourEau', 'CourEau');
	define('NbrRHori', 'NbrRHori');
	define('DateConstruction', 'DateConstruction');
	define('NomMoulin', 'NomMoulin');
	define('CodeMoulin', 'CodeMoulin');
	define('IDMoulin', 'IDMoulin');
	define('Production', 'Production');
 
	//DEBUT - Remplacer les define mais ne fonctionne pas :
	//$VariablesErr="IDCommune,IDCourEau,NbrRVert,CourEau,Nom";
	//$SingVar = explode(",", $VariablesErr);
	//print_r ($SingVar);
 
	//$nbrDef = count($SingVar, COUNT_RECURSIVE);
 
	//echo $nbrDef;
	//$i = 0;
	//while ($i < $nbrDef)
	//{
	//	echo "define('$SingVar[$i]', '$SingVar[$i]');";
	//	echo $i."<br>";
	//	$i++;
	//}
	// FIN - Remplacer les define mais ne fonctionne pas :
 
	//include fichiers
	include 'bdd.php';
 
	//Methode GET
	$IDMoulin = $_GET['idmoulin'];
	//echo $IDMoulin;
 
	$reponse = $bdd->query('SELECT * FROM Moulins WHERE IDmoulin='.$IDMoulin);
	foreach($reponse as $element)
		{
		//	print_r ($element);
		}
		//echo $element[IDMoulin];
?>
<html>
	<head>
		<title>Inventaire des Moulins de Dordogne - Edition</title>
		<link rel="stylesheet" href="css/feuille1.css" />
 
 
		<!-- Script pour upload file AJAX : -->
		<script type="text/javascript" src="js/multiupload.js"></script>
		<script src="js/jquery.min.js"></script>
		<script type="text/javascript">
			var config = {
				support : "image/jpg,image/png,image/bmp,image/jpeg,image/gif",		// Valid file formats
				form: "demoFiler",					// Form ID
				dragArea: "dragAndDropFiles",		// Upload Area ID
				uploadUrl: "upload.php"				// Server side upload url
			}
			$(document).ready(function(){
				initMultiUploader(config);
			});
		</script>
		<link href="css/style.css" type="text/css" rel="stylesheet" />
		<!--	 -->
 
 
		<h2>Edition nom moulin :  <?php echo $element[NomMoulin] ?></h2>
	</head>
	<body>	
		<div id="new_left">
			<a href="index.php">Retour &agrave; l'accueil</a>
		</div>
		<div id="new_center">
			<form action="action.php" method="post">
				<input type="hidden"  name="action"  value="edit">
				<input type="hidden"  name="IDMoulin"  value="<?php echo $element[IDMoulin] ?>">
				<p>Type d'ouvrage : 
					<select name="TypeOuvrage">
						<option value="1" <?php if( isset($element['TypeOuvrage']) &&  $element['TypeOuvrage'] == "1" ) { echo "selected";	} ?>>Moulin &agrave; eau</option>
						<option value="2" <?php if( isset($element['TypeOuvrage']) &&  $element['TypeOuvrage'] == "2" ) { echo "selected";	} ?>>Moulin &agrave; vent</option>
						<option value="3" <?php if( isset($element['TypeOuvrage']) &&  $element['TypeOuvrage'] == "3" ) { echo "selected";	} ?>>Forge</option>
						<option value="4" <?php if( isset($element['TypeOuvrage']) &&  $element['TypeOuvrage'] == "4" ) { echo "selected";	} ?>>Pap&egrave;terie</option>
						<option value="5" <?php if( isset($element['TypeOuvrage']) &&  $element['TypeOuvrage'] == "5" ) { echo "selected";	} ?>>Filature</option>
					</select>
				</p>
				<p>Code Moulin:<input type="text" name="CodeMoulin" value="<?php echo $element[CodeMoulin] ?>" /></p>
				<p>Nom Moulin: <input type="text" name="NomMoulin" value="<?php echo $element[NomMoulin] ?>" /></p>
				<p>Date construction : <input type="text" name="DateConstruction" value="<?php echo $element[DateConstruction] ?>" /></p>
				<p>Type de roue : 
					<select name="TypeRoue">
					  <option value="1" <?php if( isset($element['TypeRoue']) &&  $element['TypeRoue'] == "1" ) { echo "selected";	} ?>>Verticale par dessus</option>
					  <option value="2" <?php if( isset($element['TypeRoue']) &&  $element['TypeRoue'] == "2" ) { echo "selected";	} ?>>Verticale par milieu</option>
					  <option value="3" <?php if( isset($element['TypeRoue']) &&  $element['TypeRoue'] == "3" ) { echo "selected";	} ?>>Verticale par dessous</option>
					  <option value="4" <?php if( isset($element['TypeRoue']) &&  $element['TypeRoue'] == "4" ) { echo "selected";	} ?>>Rouet en cuve</option>
					  <option value="5" <?php if( isset($element['TypeRoue']) &&  $element['TypeRoue'] == "5" ) { echo "selected";	} ?>>Rouet à cuilléres</option>
					</select>
				</p>
				<p>Nombre roue verticale : <input type="text" name="NbrRVert" value="<?php echo $element[NbrRVert] ?>" /></p>
				<p>Nombre roue horizontale : <input type="text" name="NbrRHori" value="<?php echo $element[NbrRHori] ?>" /></p>
				<p>Type de machine : 
					<select name="TypeMachine">
					  <option value="1" <?php if( isset($element['TypeMachine']) &&  $element['TypeMachine'] == "1" ) { echo "selected";	} ?>>Meules</option>
					  <option value="2" <?php if( isset($element['TypeMachine']) &&  $element['TypeMachine'] == "2" ) { echo "selected";	} ?>>Cylindres</option>
					</select>
				</p>
				<p>Production : <input type="text" name="Production" value="<?php echo $element[Production] ?>" /></p>
				<p>Tamisage : 
					<select name="Tamisage">
					  <option value="1" <?php if( isset($element['Tamisage']) &&  $element['Tamisage'] == "1" ) { echo "selected";	} ?>>Blutoir</option>
					  <option value="2" <?php if( isset($element['Tamisage']) &&  $element['Tamisage'] == "2" ) { echo "selected";	} ?>>Planchister</option>
					</select>
				</p>
 
				<!-- <p>Cours d'eau : <br><input type="text" name="CourEau" /></p> -->				
				<p>Cour d'eau : 
					<?php
						include 'bdd.php';
						//
						//On selectionne tous les cours d'eau et on les affiche dans la liste déroulante
						//
						$AllCoursEau = $bdd->query('SELECT * FROM CoursEau');
 
						//On récupére le 
						$CourEau=$element[CourEau];
 
						echo "<select name='CourEau'>";
						foreach($AllCoursEau as $CoursEau)
						{
							//echo "<option value='".$CoursEau[IDCourEau]."'>".$CoursEau[Nom]."</option>";
							echo "<option value='".$CoursEau[IDCourEau]."'";
							if($CourEau == $CoursEau[IDCourEau]) {  echo " selected "; }
							echo ">".$CoursEau[Nom]."</option>";
						}
						echo "</select>";
					?>
				</p>
				<p>Commune : 
					<?php
 
						//
						//On selectionne tous les cours d'eau et on les affiche dans la liste déroulante
						//
						$AllCommunes = $bdd->query('SELECT * FROM Communes');
 
						//On selectionne l'IDCommune en fonction de l'IDMoulin dans la table CommuneMoulin
						$sql = 'SELECT IDCommune FROM CommuneMoulin WHERE IDMoulin = '.$IDMoulin;
						$e = $bdd->prepare($sql);
						$e->execute(array('IDCommune'));
						$MyCommunes = $e->fetch(PDO::FETCH_ASSOC);
						$IDCommune=$MyCommunes[IDCommune];
						//echo $IDCommune;
 
						//On récupére le nom de la commune par le biais de l'IDCOmmune dans la table commune
						$sql = 'SELECT Nom FROM Communes WHERE IDCommune = '.$IDCommune;
						$e = $bdd->prepare($sql);
						$e->execute(array('Nom'));
						$MyCommunes = $e->fetch(PDO::FETCH_ASSOC);
						$NomCommune=$MyCommunes[Nom];
						//echo $NomCommune;
 
						//Liste déroulante avec les communes (commune du moulin déja preselectionnée)
						echo "<select name='IDCommune'>";
						foreach($AllCommunes as $Commune)
						{
							echo "<option value='".$Commune[IDCommune]."'";
							if($IDCommune == $Commune[IDCommune] ) {  echo " selected "; }
							echo ">".$Commune[Nom]."</option>";
						}
						echo "</select>";
					?>
				</p>
 
				<p>Latitude : <input type="text" name="Lat" /></p>
				<p>Longitude : <input type="text" name="Long" /></p>
				<p>Etat : 
					<select name="Etat">
					  <option value="1" <?php if( isset($element['Etat']) &&  $element['Etat'] == "1" ) { echo "selected";	} ?>>Fonctionnel</option>
					  <option value="2" <?php if( isset($element['Etat']) &&  $element['Etat'] == "2" ) { echo "selected";	} ?>>Reconverti en maison</option>
					  <option value="3" <?php if( isset($element['Etat']) &&  $element['Etat'] == "3" ) { echo "selected";	} ?>>En ruine</option>
					  <option value="4" <?php if( isset($element['Etat']) &&  $element['Etat'] == "4" ) { echo "selected";	} ?>>Inexistant</option>
					</select>
				</p>
 
				<p>Informations: <textarea name="Informations" id="Informations" value="<?php echo $element['Informations']; ?>"><?php echo $element['Informations'] ?></textarea></p>
 
				<p><input type="submit" value="Modifier"></p>
			</form>
 
			<!-- Drag and drop Add photo -->
			<div id="dragAndDropFiles" class="uploadArea">
				<h1>Drop Images Here</h1>
			</div>
			<form name="demoFiler" id="demoFiler" enctype="multipart/form-data">
				<input type="file" name="multiUpload" id="multiUpload" multiple />
				<input type="submit" name="submitHandler" id="submitHandler" value="Upload" class="buttonUpload" />
			</form>
			<div class="progressBar">
				<div class="status"></div>
			</div>
 
 
		</div>
	</body>
</html>

Comme vous pouvez le remarquer il ya bien mes 2 formulaires.

Mon formulaire edit.php avec 1 seul form : => fonctionne 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
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
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
<?php
	//Definition des variables (pour enlever les erreurs dans les logs)
	define('Nom', 'Nom');
	define('IDCommune', 'IDCommune');
	define('IDCourEau', 'IDCourEau');
	define('NbrRVert', 'NbrRVert');
	define('CourEau', 'CourEau');
	define('NbrRHori', 'NbrRHori');
	define('DateConstruction', 'DateConstruction');
	define('NomMoulin', 'NomMoulin');
	define('CodeMoulin', 'CodeMoulin');
	define('IDMoulin', 'IDMoulin');
	define('Production', 'Production');
 
	//DEBUT - Remplacer les define mais ne fonctionne pas :
	//$VariablesErr="IDCommune,IDCourEau,NbrRVert,CourEau,Nom";
	//$SingVar = explode(",", $VariablesErr);
	//print_r ($SingVar);
 
	//$nbrDef = count($SingVar, COUNT_RECURSIVE);
 
	//echo $nbrDef;
	//$i = 0;
	//while ($i < $nbrDef)
	//{
	//	echo "define('$SingVar[$i]', '$SingVar[$i]');";
	//	echo $i."<br>";
	//	$i++;
	//}
	// FIN - Remplacer les define mais ne fonctionne pas :
 
	//include fichiers
	include 'bdd.php';
 
	//Methode GET
	$IDMoulin = $_GET['idmoulin'];
	//echo $IDMoulin;
 
	$reponse = $bdd->query('SELECT * FROM Moulins WHERE IDmoulin='.$IDMoulin);
	foreach($reponse as $element)
		{
		//	print_r ($element);
		}
		//echo $element[IDMoulin];
?>
<html>
	<head>
		<title>Inventaire des Moulins de Dordogne - Edition</title>
		<link rel="stylesheet" href="css/feuille1.css" />
 
 
		<!-- Script pour upload file AJAX : -->
		<script type="text/javascript" src="js/multiupload.js"></script>
		<script src="js/jquery.min.js"></script>
		<script type="text/javascript">
			var config = {
				support : "image/jpg,image/png,image/bmp,image/jpeg,image/gif",		// Valid file formats
				form: "demoFiler",					// Form ID
				dragArea: "dragAndDropFiles",		// Upload Area ID
				uploadUrl: "action.php"				// Server side upload url
			}
			$(document).ready(function(){
				initMultiUploader(config);
			});
		</script>
		<link href="css/style.css" type="text/css" rel="stylesheet" />
		<!--	 -->
 
 
		<h2>Edition nom moulin :  <?php echo $element[NomMoulin] ?></h2>
	</head>
	<body>	
		<div id="new_left">
			<a href="index.php">Retour &agrave; l'accueil</a>
		</div>
		<div id="new_center">
			<form action="action.php" method="post" name="demoFiler" id="demoFiler" enctype="multipart/form-data>
				<input type="hidden"  name="action"  value="edit">
				<input type="hidden"  name="IDMoulin"  value="<?php echo $element[IDMoulin] ?>">
				<p>Type d'ouvrage : 
					<select name="TypeOuvrage">
						<option value="1" <?php if( isset($element['TypeOuvrage']) &&  $element['TypeOuvrage'] == "1" ) { echo "selected";	} ?>>Moulin &agrave; eau</option>
						<option value="2" <?php if( isset($element['TypeOuvrage']) &&  $element['TypeOuvrage'] == "2" ) { echo "selected";	} ?>>Moulin &agrave; vent</option>
						<option value="3" <?php if( isset($element['TypeOuvrage']) &&  $element['TypeOuvrage'] == "3" ) { echo "selected";	} ?>>Forge</option>
						<option value="4" <?php if( isset($element['TypeOuvrage']) &&  $element['TypeOuvrage'] == "4" ) { echo "selected";	} ?>>Pap&egrave;terie</option>
						<option value="5" <?php if( isset($element['TypeOuvrage']) &&  $element['TypeOuvrage'] == "5" ) { echo "selected";	} ?>>Filature</option>
					</select>
				</p>
				<p>Code Moulin:<input type="text" name="CodeMoulin" value="<?php echo $element[CodeMoulin] ?>" /></p>
				<p>Nom Moulin: <input type="text" name="NomMoulin" value="<?php echo $element[NomMoulin] ?>" /></p>
				<p>Date construction : <input type="text" name="DateConstruction" value="<?php echo $element[DateConstruction] ?>" /></p>
				<p>Type de roue : 
					<select name="TypeRoue">
					  <option value="1" <?php if( isset($element['TypeRoue']) &&  $element['TypeRoue'] == "1" ) { echo "selected";	} ?>>Verticale par dessus</option>
					  <option value="2" <?php if( isset($element['TypeRoue']) &&  $element['TypeRoue'] == "2" ) { echo "selected";	} ?>>Verticale par milieu</option>
					  <option value="3" <?php if( isset($element['TypeRoue']) &&  $element['TypeRoue'] == "3" ) { echo "selected";	} ?>>Verticale par dessous</option>
					  <option value="4" <?php if( isset($element['TypeRoue']) &&  $element['TypeRoue'] == "4" ) { echo "selected";	} ?>>Rouet en cuve</option>
					  <option value="5" <?php if( isset($element['TypeRoue']) &&  $element['TypeRoue'] == "5" ) { echo "selected";	} ?>>Rouet à cuilléres</option>
					</select>
				</p>
				<p>Nombre roue verticale : <input type="text" name="NbrRVert" value="<?php echo $element[NbrRVert] ?>" /></p>
				<p>Nombre roue horizontale : <input type="text" name="NbrRHori" value="<?php echo $element[NbrRHori] ?>" /></p>
				<p>Type de machine : 
					<select name="TypeMachine">
					  <option value="1" <?php if( isset($element['TypeMachine']) &&  $element['TypeMachine'] == "1" ) { echo "selected";	} ?>>Meules</option>
					  <option value="2" <?php if( isset($element['TypeMachine']) &&  $element['TypeMachine'] == "2" ) { echo "selected";	} ?>>Cylindres</option>
					</select>
				</p>
				<p>Production : <input type="text" name="Production" value="<?php echo $element[Production] ?>" /></p>
				<p>Tamisage : 
					<select name="Tamisage">
					  <option value="1" <?php if( isset($element['Tamisage']) &&  $element['Tamisage'] == "1" ) { echo "selected";	} ?>>Blutoir</option>
					  <option value="2" <?php if( isset($element['Tamisage']) &&  $element['Tamisage'] == "2" ) { echo "selected";	} ?>>Planchister</option>
					</select>
				</p>
 
				<!-- <p>Cours d'eau : <br><input type="text" name="CourEau" /></p> -->				
				<p>Cour d'eau : 
					<?php
						include 'bdd.php';
						//
						//On selectionne tous les cours d'eau et on les affiche dans la liste déroulante
						//
						$AllCoursEau = $bdd->query('SELECT * FROM CoursEau');
 
						//On récupére le 
						$CourEau=$element[CourEau];
 
						echo "<select name='CourEau'>";
						foreach($AllCoursEau as $CoursEau)
						{
							//echo "<option value='".$CoursEau[IDCourEau]."'>".$CoursEau[Nom]."</option>";
							echo "<option value='".$CoursEau[IDCourEau]."'";
							if($CourEau == $CoursEau[IDCourEau]) {  echo " selected "; }
							echo ">".$CoursEau[Nom]."</option>";
						}
						echo "</select>";
					?>
				</p>
				<p>Commune : 
					<?php
 
						//
						//On selectionne tous les cours d'eau et on les affiche dans la liste déroulante
						//
						$AllCommunes = $bdd->query('SELECT * FROM Communes');
 
						//On selectionne l'IDCommune en fonction de l'IDMoulin dans la table CommuneMoulin
						$sql = 'SELECT IDCommune FROM CommuneMoulin WHERE IDMoulin = '.$IDMoulin;
						$e = $bdd->prepare($sql);
						$e->execute(array('IDCommune'));
						$MyCommunes = $e->fetch(PDO::FETCH_ASSOC);
						$IDCommune=$MyCommunes[IDCommune];
						//echo $IDCommune;
 
						//On récupére le nom de la commune par le biais de l'IDCOmmune dans la table commune
						$sql = 'SELECT Nom FROM Communes WHERE IDCommune = '.$IDCommune;
						$e = $bdd->prepare($sql);
						$e->execute(array('Nom'));
						$MyCommunes = $e->fetch(PDO::FETCH_ASSOC);
						$NomCommune=$MyCommunes[Nom];
						//echo $NomCommune;
 
						//Liste déroulante avec les communes (commune du moulin déja preselectionnée)
						echo "<select name='IDCommune'>";
						foreach($AllCommunes as $Commune)
						{
							echo "<option value='".$Commune[IDCommune]."'";
							if($IDCommune == $Commune[IDCommune] ) {  echo " selected "; }
							echo ">".$Commune[Nom]."</option>";
						}
						echo "</select>";
					?>
				</p>
 
				<p>Latitude : <input type="text" name="Lat" /></p>
				<p>Longitude : <input type="text" name="Long" /></p>
				<p>Etat : 
					<select name="Etat">
					  <option value="1" <?php if( isset($element['Etat']) &&  $element['Etat'] == "1" ) { echo "selected";	} ?>>Fonctionnel</option>
					  <option value="2" <?php if( isset($element['Etat']) &&  $element['Etat'] == "2" ) { echo "selected";	} ?>>Reconverti en maison</option>
					  <option value="3" <?php if( isset($element['Etat']) &&  $element['Etat'] == "3" ) { echo "selected";	} ?>>En ruine</option>
					  <option value="4" <?php if( isset($element['Etat']) &&  $element['Etat'] == "4" ) { echo "selected";	} ?>>Inexistant</option>
					</select>
				</p>
 
				<p>Informations: <textarea name="Informations" id="Informations" value="<?php echo $element['Informations']; ?>"><?php echo $element['Informations'] ?></textarea></p>
 
				<p><input type="submit" value="Modifier"></p>
			</form>
 
			<!-- Drag and drop Add photo -->
			<div id="dragAndDropFiles" class="uploadArea">
				<h1>Drop Images Here</h1>
			</div>
			//<form name="demoFiler" id="demoFiler" enctype="multipart/form-data">
			//	<input type="file" name="multiUpload" id="multiUpload" multiple />
			//	<input type="submit" name="submitHandler" id="submitHandler" value="Upload" class="buttonUpload" />
			//</form>
			<div class="progressBar">
				<div class="status"></div>
			</div>
 
 
		</div>
	</body>
</html>

Quand je met le bout de code upload.php dans mon fichier action.php ca ne fonctionne plus, meme si dans mon fichier je change uploadUrl: "upload.php" par uploadUrl: "action.php"

action.php :

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
...
elseif ($action == edit){
		echo "Edition Moulin";
		//
		//Edition du moulin
		//
		$req = $bdd->prepare('UPDATE Moulins SET NbrRVert = :NbrRVert, NbrRHori = :NbrRHori, TypeRoue = :TypeRoue, TypeMachine = :TypeMachine, Production = :Production, Tamisage = :Tamisage, CourEau = :CourEau, DateConstruction = :DateConstruction, Lat = :Lat, Lon = :Lon, Informations = :Informations, Etat = :Etat, CodeMoulin = :CodeMoulin, NomMoulin = :NomMoulin, TypeOuvrage = :TypeOuvrage WHERE IDMoulin ='.$IDMoulin);
		$req->execute(array(
			'NbrRVert' => $NbrRVert,
			'NbrRHori' => $NbrRHori,
			'TypeRoue' => $TypeRoue,
			'TypeMachine' => $TypeMachine,
			'Production' => $Production,
			'Tamisage' => $Tamisage,
			'CourEau' => $CourEau,
			'DateConstruction' => $DateConstruction,
			'Lat' => $Lat,
			'Lon' => $Lon,
			'Informations' => $Informations,
			'Etat' => $Etat,
			'CodeMoulin' => $CodeMoulin,
			'NomMoulin' => $NomMoulin,
			'TypeOuvrage' => $TypeOuvrage
		));
 
		//Modification de la commune associée au Moulin
			$bdd->query('UPDATE CommuneMoulin SET IDCommune ='.$IDCommune.' WHERE IDMoulin ='.$IDMoulin);
 
 
		echo '<br>Le Moulin a bien &egrave;t&egrave; modifi&egrave; !';
 
 
		//Upload photo => je reprend le code de upload.php
		if($_SERVER['REQUEST_METHOD'] == "POST"){
			if(move_uploaded_file($_FILES['file']['tmp_name'], "uploads/".$_FILES['file']['name'])){
				echo($_POST['index']);
			}
			exit;
		} else {
			echo "Erreur ajout photo";
		}

fichier js :

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
function multiUploader(config){
 
	this.config = config;
	this.items = "";
	this.all = []
	var self = this;
 
	multiUploader.prototype._init = function(){
		if (window.File && 
			window.FileReader && 
			window.FileList && 
			window.Blob) {		
			 var inputId = $("#"+this.config.form).find("input[type='file']").eq(0).attr("id");
			 document.getElementById(inputId).addEventListener("change", this._read, false);
			 document.getElementById(this.config.dragArea).addEventListener("dragover", function(e){ e.stopPropagation(); e.preventDefault(); }, false);
			 document.getElementById(this.config.dragArea).addEventListener("drop", this._dropFiles, false);
			 document.getElementById(this.config.form).addEventListener("submit", this._submit, false);
		} else
			console.log("Browser supports failed");
	}
 
	multiUploader.prototype._submit = function(e){
		e.stopPropagation(); e.preventDefault();
		self._startUpload();
	}
 
	multiUploader.prototype._preview = function(data){
		this.items = data;
		if(this.items.length > 0){
			var html = "";		
			var uId = "";
 			for(var i = 0; i<this.items.length; i++){
				uId = this.items[i].name._unique();
				var sampleIcon = '<img src="images/image.png" />';
				var errorClass = "";
				if(typeof this.items[i] != undefined){
					if(self._validate(this.items[i].type) <= 0) {
						sampleIcon = '<img src="images/unknown.png" />';
						errorClass =" invalid";
					} 
					html += '<div class="dfiles'+errorClass+'" rel="'+uId+'"><h5>'+sampleIcon+this.items[i].name+'</h5><div id="'+uId+'" class="progress" style="display:none;"><img src="images/ajax-loader.gif" /></div></div>';
				}
			}
			$("#dragAndDropFiles").append(html);
		}
	}
 
	multiUploader.prototype._read = function(evt){
		if(evt.target.files){
			self._preview(evt.target.files);
			self.all.push(evt.target.files);
		} else 
			console.log("Failed file reading");
	}
 
	multiUploader.prototype._validate = function(format){
		var arr = this.config.support.split(",");
		return arr.indexOf(format);
	}
 
	multiUploader.prototype._dropFiles = function(e){
		e.stopPropagation(); e.preventDefault();
		self._preview(e.dataTransfer.files);
		self.all.push(e.dataTransfer.files);
	}
 
	multiUploader.prototype._uploader = function(file,f){
		if(typeof file[f] != undefined && self._validate(file[f].type) > 0){
			var data = new FormData();
			var ids = file[f].name._unique();
			data.append('file',file[f]);
			data.append('index',ids);
			$(".dfiles[rel='"+ids+"']").find(".progress").show();
			$.ajax({
				type:"POST",
				url:this.config.uploadUrl,
				data:data,
				cache: false,
				contentType: false,
				processData: false,
				success:function(rponse){
					$("#"+ids).hide();
					var obj = $(".dfiles").get();
					$.each(obj,function(k,fle){
						if($(fle).attr("rel") == rponse){
							$(fle).slideUp("normal", function(){ $(this).remove(); });
						}
					});
					if (f+1 < file.length) {
						self._uploader(file,f+1);
					}
				}
			});
		} else
			console.log("Invalid file format - "+file[f].name);
	}
 
	multiUploader.prototype._startUpload = function(){
		if(this.all.length > 0){
			for(var k=0; k<this.all.length; k++){
				var file = this.all[k];
				this._uploader(file,0);
			}
		}
	}
 
	String.prototype._unique = function(){
		return this.replace(/[a-zA-Z]/g, function(c){
     	   return String.fromCharCode((c <= "Z" ? 90 : 122) >= (c = c.charCodeAt(0) + 13) ? c : c - 26);
    	});
	}
 
	this._init();
}
 
function initMultiUploader(){
	new multiUploader(config);
}

Le but est de n'avoir qu'un seul formulaire et que quand je clique sur le bouton 'Modifier' ca me change éventuellement les champs dans la BDD ET que ca m'upload les fichier et biensur il faudra que je récupére tous les noms des images pour les mettre dans ma BDD également...

Car dans l'état actuel des choses, si je remplace dans mon edit.php uploadUrl: "upload.php" par uploadUrl: "action.php" ca ne modifie ni les champs dans ma BDD et ca n'upload pas la photo non plus

Merci par avance pour votre aide.

Invité · 04/04/2016, 09h06

Bonjour,

si tu n'as pas de réponse, c'est peut-être que la question est mal posée, ou que tu noies le sujet dans trop de code...
(à toi de simplifier, et de nous fournir uniquement le code nécessaire est suffisant à la compréhension du problème)
Revois ta copie.

Sinon, il manque un " :

Code html :

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

<form action="action.php" method="post" name="demoFiler" id="demoFiler" enctype="multipart/form-data>

=>

Code html :

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

<form action="action.php" method="post" name="demoFiler" id="demoFiler" enctype="multipart/form-data">

**psylo24** · 05/04/2016, 21h15

Bonsoir, ok trés bien je vais essayer d'etre plus clair.

J'ai trouvé un bou de code qui me permet d'upload des fichiers sur mon serveur via JS/AJAX.

CAS 1 : 1 formulaire + 1 fichier PHP dédié pour l'upload => Cas qui fonctionne donc pas de probléme

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
 
<!-- Drag and drop Add photo -->
<div id="dragAndDropFiles" class="uploadArea">
	<h1>Drop Images Here</h1>
</div>
<form name="demoFiler" id="demoFiler" enctype="multipart/form-data">
	<input type="file" name="multiUpload" id="multiUpload" multiple />
	<input type="submit" name="submitHandler" id="submitHandler" value="Upload" class="buttonUpload" />
</form>
<div class="progressBar">
	<div class="status"></div>
</div>

Et dans un autre fichier mon fichier upload.php qui sert pour l'upload :

Code :

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

1
2
3
4
5
6
7
8
9
//Upload photo => je reprend le code de upload.php
if($_SERVER['REQUEST_METHOD'] == "POST"){
	if(move_uploaded_file($_FILES['file']['tmp_name'], "uploads/".$_FILES['file']['name'])){
		echo($_POST['index']);
	}
	exit;
} else {
	echo "Erreur ajout photo";
}

Etant donné que l'ajout de photo est une fonctionnalité supplémentaire que je souhaite ajouter à mon code existant je souhaite donc avoir un seul et unique form au niveau HTML et 1 seul fichier PHP pour mes traitements :

CAS 2 : 1 seul form et 1 seul fichier php pour mes traitements => Cas qui ne fonctionne pas
Mon formulaire :

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
 
		<!-- Script pour upload file AJAX : -->
		<script type="text/javascript" src="js/multiupload.js"></script>
		<script src="js/jquery.min.js"></script>
		<script type="text/javascript">
			var config = {
				support : "image/jpg,image/png,image/bmp,image/jpeg,image/gif",		// Valid file formats
				form: "demoFiler",					// Form ID
				dragArea: "dragAndDropFiles",		// Upload Area ID
				uploadUrl: "action.php"				// vers mon fichier où je fais tous mes traitements
			}
			$(document).ready(function(){
				initMultiUploader(config);
			});
		</script>
		<link href="css/style.css" type="text/css" rel="stylesheet" />
		<!--	 -->
	</head>
	<body>	
		<div id="new_center">
			<form action="action.php" method="post" name="demoFiler" id="demoFiler" enctype="multipart/form-data">
				<input type="hidden"  name="action"  value="edit">
				....
				....
				<input type="file" name="multiUpload" id="multiUpload" multiple />
				<input type="submit" value="Modifier">
			</form>

Et mon fichier action.php qui est appelé quand je valide mon formulaire (voir le dernier if qui est le même code que dans upload.php):

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
....
elseif ($action == edit){
                 //Mon code actuel qui fonctionne :
		$req = $bdd->prepare('UPDATE Moulins SET NbrRVert = :...................................................);
		$req->execute(array(
			'NbrRVert' => $NbrRVert,
                         ................
		)); 
		$bdd->query('UPDATE CommuneMoulin SET ...............................);
 
                //Et mon code pour l'ajout de photo qui du coup ne fonctionne pas.
		//Upload photo => je reprend le code de upload.php
		if($_SERVER['REQUEST_METHOD'] == "POST"){
			if(move_uploaded_file($_FILES['file']['tmp_name'], "uploads/".$_FILES['file']['name'])){
				echo($_POST['index']);
			}
			exit;
		} else {
			echo "Erreur ajout photo";
		}

Dans le cas2 mon fichier que j'essaie d'uploader n’apparaît pas sur mon serveur et je vois bien à travers le JS que l’icône qui apparaît est que l'upload ne se termine pas).
Et je veux faire comme ceci car je veux éditer les champs de ma BDD et quand je valide je veux que ça me modifie bien les champs dans ma BDD ET que ca m'upload les fichiers par la même occasion sur le serveur au lieu de cliquer en premier sur le bouton pour uploader les fichiers puis sur le bouton pour valider mon premier formulaire.

Vous trouverez le script JS dans mon premier post.

Cordialement et merci par avance pour vos suggestions.

**psylo24** · 07/04/2016, 18h43

Bonsoir tout le monde,

Personne n'a une idée concernant la résolution de mon problème ?

N"hésitez pas à me dire si ce n'est pas assez clair ou si vous avez besoin de compléments d’information.

Merci par avance pour votre retour.

**kevin254kl** · 07/04/2016, 18h54

Bonjour, pourquoi vouloir le faire en ajax de toute façon tu envois tes fichiers en même temps que tes données?

**psylo24** · 08/04/2016, 13h24

Bonjour,

Je souhaite en fait pouvoir ajouter des fichiers images, en faisant du drag and drop, et que quand je valide mon formulaire j'arrive dans la section edit de mon action.php qui me fera :
1/ redimensionnement des photos
2/ upload des photos
3/ Ajout du path de mes photos dans la BDD.

Comme vous l'aurez remarqué il n'y a pour le moment que l'upload des fichier qui, au final ne fonctionne pas.

Étant donné que je ne suis pas expert en PHP et encore moins en Ajax/JS j'ai repris un bout de code

formulaire + PHP + JS

Langage PHP

Discussions similaires

Partager

Partager