jQuery - recevoir le tableau $ _FILES en utilisant $ .post

Question

Je tente de soumettre un formulaire via jQuery. Mon formulaire contient des champs et un fichier à télécharger. Il est de type ENCTYPE="multipart/form-data".

Je peux recevoir toutes mes valeurs de champs en utilisant: post = $('#myForm').serialize(); Mais comment puis-je recevoir la matrice $_FILES? J'ai besoin de cela pour traiter le fichier téléchargé. Est-ce possible en utilisant jQuery, et si oui, comment? Ou dois-je utiliser un plugin de téléchargement spécial pour jQuery?

Answer 1

Vous ne pouvez pas télécharger de fichiers via javascript.

Vérifiez cette question connexe:
Is it possible to use Ajax to do file upload?

Essentiellement, les deux méthodes les plus populaires de « faire semblant » AJAX pour le téléchargement de fichiers utilise un plugin Flash tel que SWFUpload ou soumettre le formulaire à un iframe caché que les processus la demande. forme

Answer 2

jquery est la meilleure façon de le faire, vous pouvez l'ajouter à toute forme normale,

<form method="post" action="URL"> 
<input type="file" name="file"> 
<input type="text" name"text"> 
<input type="submit"> 
</form> 

<script type="text/javascript"> 
$(document).ready(function() { 
    $(form).ajaxForm(); 
}) 
</script> 

fonctionnera comme prévu, mais avec ajax.

http://malsup.com/jquery/form/#code-samples

Answer 3

Si vous pouvez contrôler l'environnement, comme, par exemple, vous écrivez une application d'administration pour un intranet dans lequel vous recommandez le navigateur, puis le téléchargement de fichiers AJAX réel sont possibles avec Firefox 3 et plus. Dans tous les autres cas, la solution de contournement iframe ou un programme de mise en ligne Flash est la solution.

Answer 4

Il est possible, mais ne fonctionne pas dans Google Chrome) Regardez!

... 
<form method='post' enctype='multipart/form-data'> 
<input type="file" id="imf" name="imf"/> 
<input type="button" id="Save"/> 
</form> 

... 

$("#Save").live("click", function(){ 

var photo = document.getElementById("imf"); 
var file = photo.files[0]; 

    $.post('/user/saveNewPhoto', {'imf':file.getAsDataURL(), fname:file.fileName }, function(data){ 
    alert (data); 
    }); 

}); 

script côté télécharger doit décoder base64) et qui est tout mais je ne teste pas ce script sur le fichier de grande taille

Answer 5

formulaire contient une entrée de fichier, mais il manque method = POST et enctype = multipart/form-data sur le formulaire. Le fichier ne sera pas envoyé

Answer 6

Utilisez FormData

<form> 
<label for="imageToSend">Cargar imagen a la galeria</label> 
<input type="file" name="imageToSend" id="imageToSend" value="Cargar imagen" /> 
</form> 
<script> 
$('#imageToSend').on('change',function(event){ 
    var dialog = $('#dialog'); 
    var Data = new FormData(); 
    Data.append('imageToSend',$('#imageToSend')[0].files); 
    $(this).val('');//Clear input file 
    $.ajax({ 
     url: "/upload", 
     data: Data, 
     processData: false, 
     contentType: false, 
     type:'POST', 
     success: function(data){ 
      if(data.success){ 
       //success handler 
      }else if(!data.success){ 
       //error backend handler 
      } 
     }, 
     error: function(data){ 
      //error handler Ej:404 status 
     } 
    }) 
    }); 
</script>