title: How to upload a file using Ajax on POST?
body: <p>I know, the topics aren't missing on this subject but bear with me. I'd like to upload a file to the server using Ajax or an equivalent.</p>
  
  <pre><code># html
  &lt;form method="post" id="Form" enctype="multipart/form-data"&gt;
    {% csrf_token %} # django security
    &lt;input id="image_file" type="file" name="image_file"&gt;
    &lt;input type="submit" value="submit"&gt;
  &lt;/form&gt;
  </code></pre>
  
  <hr>
  
  <pre><code># javascript
  $(document).on('submit', '#Form', function(e){
    e.preventDefault();
  
    var form_data = new FormData();
    form_data.append('file', $('#image_file').get(0).files);
  
    $.ajax({
        type:'POST',
        url:'my_url',
        processData: false,
        contentType: false,
        data:{
            logo:form_data,
            csrfmiddlewaretoken:$('input[name=csrfmiddlewaretoken]').val(), # django security
        },
    });
  });
  </code></pre>
  
  <hr>
  
  <pre><code># views.py (server side)
  def myFunction(request):
      if request.method == 'POST':
          image_file = request.FILES
          ...
  ...
  </code></pre>
  
  <p>I guess there's an issue with the way I configured the ajax function since on debug mode, every data are returned except the <code>logo</code>. </p>
  
  <p>Am I doing something incorrectly?</p>