Uploader une image en ajax

Version imprimable

05/09/2010, 14h00
DevilYann

Uploader une image en ajax

Bonjour à tous

Ma question est simple :
Je voulais savoir s'il était possible d'uploader une image en ajax ?

Merci d'avance ;)
06/09/2010, 09h19
gwyohm

Bonjour,

la réponse est simple : non
Ajax ne gère pas le multipart form data

Il faut que tu passes par une iframe cachée ou par un composant tiers (en flash par exemple)
06/09/2010, 10h01
DevilYann

Merci pour ta réponse :ccool:
Tu pourrais m'en dire plus stp sur l'iframe cachée ?
Je sais que ce n'est pas aux normes html, mais comme c'est pour la partie administration du site...
06/09/2010, 12h20
gwyohm

le truc c'est d'avoir une iframe invisible (width height à 0)
et de mettre en target de ton formulaire d'upload cette fameuse iframe. Les utilisateurs peuvent ainsi déclencher un upload sans quitter la page en cours.

Tu auras intérêt à désactiver le formulaire d'upload une fois qu'un téléchargement est lancé tant qu'il n'est pas fini. une fois qu'il est terminé, dans ta page d'upload, tu executes une fonction javascript sur la fenetre parent pour réactiver le formulaire et éventuellement afficher l'image uploadée
06/09/2010, 13h26
DevilYann

Vu que je n'utilise jamais d'iframe, aurais tu la patience de me donner un petit exemple vide illustrant ceci stp ? :mrgreen:

Dans l'action du form, il faut que je mette le nom de l'iframe ?
Et le src de l'iframe doit pointer sur mon fichier php contenant le traitement de l'image ?

au fait, on peut aussi mettre l'iframe en display:none ;)

Citation:

Envoyé par DevilYann

Dans l'action du form, il faut que je mette le nom de l'iframe ?

Non, dans l'action tu mets l'action ; le chemin vers ton script php. en target du formulaire tu mets le nom de l'iframe

Citation:

Envoyé par DevilYann

Et le src de l'iframe doit pointer sur mon fichier php contenant le traitement de l'image ?

non si tu fais ca au chargement de ta page, l'iframe appelera ton php mais sans fichier à uploader

Citation:

Envoyé par DevilYann

au fait, on peut aussi mettre l'iframe en display:none ;)

euh je ne pense pas... mets lui width=0;height=0;border=0;

Citation:

Envoyé par DevilYann

Vu que je n'utilise jamais d'iframe, aurais tu la patience de me donner un petit exemple vide illustrant ceci stp ? :mrgreen:
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 <body> <script type="text/javascript"> var uploadDone = function(message) { alert(message) } </script> <form method="post" id="frameForm" target="frameUpload" action="upload.php" enctype="multipart/form-data"> <input type="file" name="file"/> <input type="submit"/> </form> <iframe name="frameUpload" style="width:0;height:0;border:0;"> </iframe>
et dans ton php qui fait l'upload, à la fin tu fais appel à uploadDone :
Code:

1 2 3 4 <script type="text/javascript"> window.parent.uploadDone("ok"); </script>

07/09/2010, 10h07
DevilYann

Merci bien gwyohm pour ta réponse très claire ;)
Je ne connaissais pas cette méthode, je n'avais jamais utilisé l'attribut target de la balise form.
Merci pour cet éclaircissement !