fichier Upload avec simple AJAX/JS et Django

Question

c'est ma forme popup

<div class="popup media-upload-form"> 
    <div class="border cf"> 
    <div class="close">X</div> 
    </div> 
    <form class="cf" action="" method="POST" enctype="multipart/form-data"> 
    {% csrf_token %} 

    <!-- {{ form.as_p }} this is what i use, just putting plain html to show you all inputs --> 
    <p> 
     <label for="id_audio">Audio:</label> 
     <input type="file" name="audio" required id="id_audio" /> 
    </p> 
    <input class="button" type="submit" value="Upload" /> 
    </form> 
</div> 

ce que je l'habitude de le faire sans ajax

def upload_media(request): 
    if request.method == 'POST': 
     form = forms.MediaForm(request.POST, request.FILES) 
     if form.is_valid(): 
      media_file = form.cleaned_data['audio'] 
      media = models.PlayerMedia() 
      media.user = request.user 
      media.title = str(media_file) 
      media.description = 'good song' 
      media.media = media_file 
      media.save() 

     return HttpResponse('done') 

fichier

vient requets.FILES [ 'nom de fichier '] et c'est le problème, je ne sais pas comment envoyer le fichier de js à la vue django. JQuery a quelques plugins mais je veux le faire sans bibliothèques.

ce que j'ai jusqu'à présent

var uploadForm = document.querySelector('.media-upload-form form'); 
var fileInput = document.querySelector('.media-upload-form form #id_audio'); 

uploadForm.onsubmit = function(e) { 
    e.preventDefault(); 

    var fileToSend = fileInput.value; // this is not it 
} 

alors comment puis-je obtenir référence au fichier sélectionné et l'envoyer avec ajax à Django pour le traitement?

Answer 1

Je l'ai eu!

Turns, je avais besoin d'un objet FormData pour envoyer des fichiers, donc j'obtenir le fichier sur l'entrée à la propriété des fichiers, et vient de créer FormField mettre dans le fichier avec la fonction append et envoyer des données aussi régulières, voici à quoi il ressemble

var mediaFile = fileInput.files[0]; 
var formData = new FormData(); 
formData.append('media', mediaFile); 

request.send(formData); // done 

puis recevoir de la vue Django avec request.FILES

def upload_media(request): 
    if request.method == 'POST': 
     media_file = request.FILES['media']