2010-11-27 14 views
1

Je crée un ajax uploader avec mootools. Lorsque je supprime l'ajax et que je télécharge simplement le formulaire, je reçois $ _FILES avec les données de fichier présentes. Mais quand j'utilise la version ajax, le $ _FILES super global est vide. Toutes les autres parties du formulaire sont présentes. Il agit comme s'il n'envoyait pas l'image mais uniquement dans la version ajax. Toute aide est appréciée. Merci!Téléchargement d'images avec Mootools

<form id="uploadphoto_pod" action="upload.php" enctype="multipart/form-data" method="post"> 
<input type='file' id='uploadphoto' name='uploadphoto'/> 
<input type="submit" class="submit" name="add_product" value="Upload" /> 
    </form> 
    <div id="response"><!-- Ajax Response --></div> 
<script type="text/javascript"> 
window.addEvent('domready', function(){ 
$('uploadphoto').addEvent('submit', function(e) { 
    //Prevents the default submit event from loading a new page. 
    e.stop(); 
    //("this" refers to the $('uploadphoto') element). 
    this.set('send', {onComplete: function(response) { 
     $('response').set('html', response); 
    }}); 
    //Send the form. 
    this.send(); 
}); 
}); 
    </script> 

Répondre

0

Vous ne pouvez pas faire cela avec Javascript seul. Vous aurez besoin d'une sorte de plugin flash comme SWFUpload. Ou utilisez le nouveau XMLHTTPRequest v2. Le dernier n'est pas encore supporté par tous les navigateurs. Alors restez avec la première option pour le moment.

+0

Merci pour votre réponse – abhis

+0

vous pouvez le faire avec js seul dans un navigateur qui prend en charge html5, en fait. vous pouvez également utiliser un shim iframe (google pour AIM shim) ou utiliser le logiciel de chargement fantaisie de harald (via un fichier .swf) http://digitarald.de/project/fancyupload/ aussi, consultez le http://mootools.net/ de thierry bela forge/p/uploadmanager qui utilise html5 ou l'astuce de shim comme solution de repli (donc, amélioration progressive) –

2

Il y a aussi le "Form.Upload" Mootools Plugin qui fait un bon téléchargement HTML5 avec fallback automatique pour le navigateur plus - il fait bien l'affaire, même implémente le téléchargement de fichiers multiples avec l'aide de glisser-déposer &, mais il manque malheureusement un peu à extensibilité - Je suis actuellement essayer d'implémenter une fonction qui me permet d'ajouter des éléments de formulaire supplémentaires - actuellement, seuls les fichiers d'entrée de fichier sont soumis.

Il ya quelques minutes, j'ai découvert this simple and lean "File.Upload" Extension - cela a finalement fait l'affaire. Il est très configurable et me permet d'envoyer des champs supplémentaires au fichier de réception des données de formulaire. Il n'y a cependant pas de sélection de fichiers multiples, mais cela semble parfait pour de simples ajax uploads en un seul fichier et peut être déclenché par exemple sur l'événement de changement du champ de saisie du sélecteur de fichiers.