Aucun callback Ajax après soumission formulaire

**Rony Rauzduel** · 16/10/2012, 10h11

Bonjour à toutes et à tous,

Un formulaire ayant le style="display:none" est utlisé pour un upload de fichiers. Dans mon code Javascript j'effectue un appel Ajax avec JSON mais je n'ai aucun retour de mon script Javascript ... même pas un simple alert.

Code html :

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

1
2
3
4
5
6
7
8
9
<div id="ajoutPhotos"></div> <!-- div pour ajout des photos après envoi au serveur -->
<!-- formulaire pour ajout des photos dans la zone producteur -->
				<form name="form4" id="formPhotosAjout" enctype="multipart/form-data" action="ajout_publierPhotos.php" method="post" style="display:none">
					<input type="hidden" name="MAX_FILE_SIZE" value="300000" />
					<h5><img class="ico_categorie" src="img/ico_epingle.png" title="Ajouter vos photos" />Publier les photos de votre vignoble</h5>
					<input type="file" name="photo" id="photo" size=50 accept="image/*" autofocus="autofocus" height="100px" width="130px" />	<br/>
					<input type="text" name="photo_desc" id="photo_desc" size=50 placeholder="e.g : Une cave vinicole du Domaine de Pierrefeu" required="required" /><p />		
					<input type="submit" name="submit" id="submit" value="Publier" style="font-size: 14px;border:solid 1px #375D81;color:#760001;" />
				</form><!-- formPhotosAjout -->

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
$(document).ready(function() {
	$(".ajout_photos").click(function() {
		/** 
		objectif : Le producteur dans son espace doit pouvoir ajouter des photos de son vignoble.
					Lorsque le producteur clique sur le bouton ajouter des photos dans sa zone producteur.
		*/
		$("#formPhotosAjout").fadeIn(1500);		
		$(".ajout_photos").hide();		
		$(".modifier").hide();
		$("#vins").hide();
 
	// pour la soumission du formulaire
		$("#formPhotosAjout").submit(function(e) {
			$("#loader").show();			
			e.preventDefault(); // empêcher le navigateur de soumettre lui même le formulaire			
 
			// utiliser l'appel Ajax pour envoyer les données et mettre le résultat dans une div
			$.ajax({
				url:$("#formPhotosAjout").attr("action"),
				type: $("#formPhotosAjout").attr('method'),
				data: $("#formPhotosAjout").serialize(),
				dataType: 'json', // ne pas oublier que json est un objet !
				success: function(json) {
					if(json.reponse == 'ok') {
						$("#loader").hide();
						$("#ajoutPhotos").append(json);
						alert('Tout est bon');	
					} else {
						alert('Erreur : '+ json.reponse);
					} // fin if() ... else											
				} // fin function(json)
			}); // fin $.ajax()
		}); // fin $("#formPhotosAjout")
 
	}); // fin $(".ajout_photos").click()	
}); // fin $(document)

Code php :

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
$nom = md5(uniqid(rand(), true)); // nom du fichier que l'on va uploadé		
 
 
			$uploads_dir = 'fichiers';
			$nom = $_FILES["photo"]["name"];
			$resultat = move_uploaded_file($_FILES['photo']['tmp_name'], "$uploads_dir/$nom");
			//if($resultat) echo 'Transfert réussi !'; 
 
 
		if(!empty($_FILES) && isset($_FILES) && isset($_POST) && !empty($_POST)){
			$photo_desc = $_POST['photo_desc'];
			if(!$resultat) {
				$reponse = 'Problème de transfert de la photo';	
			} else {
				$reponse = 'ok';
			}
		} else {
			$reponse = 'Tous les champs ne sont pas parvenus';
		}