Téléchargement de fichier HTML avec jQuery/Ajax ne fonctionne pas

Question

J'essaye d'incorporer du code de comment here de l'utilisateur de Stack DannYo, cependant ma version de son code ne semble pas courir. L'erreur et les fonctions "beforesend" reviennent à chaque fois.

HTML

<form action="" method="post" enctype="multipart/form-data"> 
    <input type="file" id="file"> 
    <input type="email" id="sender" name="sender" required> 
    <input type="email" id="receiver" name="receiver" required> 
    <input type="text" id="message" name="message"> 
    <button id="send" class="button">Send it</button> 
</form> 

JavaScript

$("form").on("submit", function() { 

    var formData = new FormData($('form')[0]); 

    $.ajax({ 
     url: 'upload.php', //server script to process data 
     type: 'POST', 
     xhr: function() { // custom xhr 

      myXhr = $.ajaxSettings.xhr(); 

      if (myXhr.upload) { // check if upload property exists 
       myXhr.upload.addEventListener('progress',progressHandlingFunction, false); // for handling the progress of the upload 
      } 

      return myXhr; 

     }, 

     //Ajax events 
     beforeSend: function() { console.log("before send function works"); }, 
     success: function(e) { 
      console.log(e); 
     }, 
     error: function() { console.log("error function works"); }, 

     // Form data 
     data: formData, 

     //Options to tell JQuery not to process data or worry about content-type 
     cache: false, 
     contentType: false, 
     processData: false 
    }); 

    return false; 

}); 

PHP

Pour des fins de test, le fichier upload.php n'a que <?php echo "success"; ?>

En utilisant l'outil de développement de réseau de Chrome, je ne vois aucun transfert de fichier. Quelqu'un voit un trou flagrant dans mon code? Merci

Answer 1

Si votre fonction d'erreur est appelée, alors la réponse est probablement dans son résultat. S'il vous plaît vérifier quelle erreur est renvoyée en affichant error function works ne vous est pas bon.

error: function(xhr, status, error) { 
    alert(xhr.responseText); 
    // OR 
    alert(status + " : " + error); 
} 

Modifier: A noter aussi, je crois que vous devez gérer l'enregistrement de fichier que vous essayez de télécharger. T his tutorial for uploading files in php peut être utile.