title: Django Jquery/Ajax File Upload No File In POST
body: <p>i am trying to work on uploading a csv to a django app.  The issue that i'm having is I can't seem to pass the file and be able to access it with my view.  There are no errors</p>
  
  <p>form.py:</p>
  
  <pre><code>class FileUploadForm(forms.Form):
     csv_file = forms.FileField()
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;form action="{% url 'ajax-view' %}" method="post" 
  enctype="multipart/form-data" id="fileForm"&gt;{% csrf_token %}
  {{ form.as_p }}
  &lt;input type="submit" value="Upload" /&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>js file:</p>
  
  <pre><code>// i've tried to add this as well passing file and data to the ajax
    var file;
    $('#id_csv_file').on('change', function(){
    file = event.target.files;
  });
  
  $('#fileForm').on('submit', function(e){
    e.preventDefault();
    var data = new FormData($('#fileForm').get(0));
    data.append('file', $('#id_csv_file')[0].files);
  
    var csrftoken = getCookie('csrftoken');
  
  $.ajax({
        type: "POST",
        headers: {'X-CSRFToken': csrftoken},
        url: '/ajax/view',
        data: {'file': data},
        processData: false,
        contentType: false,
        dataType: "json",
        success:function(data) {
  
          // display the new data
          console.log(data)
  
        }
    });
  </code></pre>
  
  <p>});</p>
  
  <p>My views are:</p>
  
  <pre><code>def view(request):
      form = FileUploadForm()
      return render(request, 'template.html', { 'form':form })
  
  def ajax_view(request):
      if request.method == "POST":
        print request.POST
        print request.FILES
  </code></pre>
  
  <p>the above prints just show: 
  <code>
  &lt;QueryDict: {}&gt;
  &lt;MultiValueDict: {}&gt;
  </code></p>