11485 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

Je souhaite upload un fichier sans rechargement de la page,
de ce fait, j'utilise la bibliothèque Jquery pour effectuer la requête via javascript (AJAX).

J'arrive très bien à traiter un formulaire avec des input text, password, ect. Mais ma méthode ne semble pas fonctionner pour les input de type file :

Voici mon code :


$("#upload form").submit(function(){
						s = $(this).serialize();
						alert(s);
						$.ajax({ 
			        		type: "POST", 
					        data: s, 
					        url: $(this).attr("action"), 
					        success: function(e){
					        	alert(e);
					        } 
			    		}); 
			    		return false; 
					});

La fonctione serialsize ne semble pas fonctionné pour mon input de type file, je pense que le problème vient d'ici, mais je n'ai pas trouvé d'autre solution...

Savez vous comment résoudre mon problème ?

D'avance merci.
Bonsoir,
peut-être faut-il préciser l'attribut enctype="multipart/form-data" dans ton form;
Sait-on jamais…
Dans tous les cas tu peux déjà voir ce que te renvoie ton inspecteur de navigateur (genre Firebug par exemple)
Merci pour ta réponse,

J'ai bien sur mis l'enctype dans mon form...
Lorsque j'alerte la variable s, elle ne contient uniquement les champs de type text, aucune valeur est renvoyé pour le input file.

Est-ce que ma méthode est bonne pour l'upload? La fonction serialize ne fonctionne peut-être pas pour les champs de type file?
En poursuivant mes recherches, j'ai pu m'apercevoir que l'upload n'est pas possible en AJAX...

Il existe cependant une bidouille en passant par les iframe (ca ne plaît pas trop...), voici un tutoriel.

C'est l'unique solution que j'ai trouvé sur la toile, si vous connaissez d'autre solutions je suis preneur.
Merci pour ce lien, mais ca me dérange d'avoir du flash sur la plate-forme que je développe.

Au final, j'ai suivi ce tutoriel et ca fonctionne niquel, c'est très simple à mettre en place.
Modifié par ggouhier (03 Jul 2010 - 19:20)