title: Posting Image Data From Ajax to WebAPI
body: <p>I am trying to pass a image dat to a web API method using example code I found on here <a href="http://www.asp.net/web-api/overview/working-with-http/sending-html-form-data,-part-2" rel="nofollow">http://www.asp.net/web-api/overview/working-with-http/sending-html-form-data,-part-2</a> and I am finding that MultipartFormDataStreamProvider.FileData is always empty. Why might this be? Also, is this the right approach to be taking? Are there options? I am trying to pass only a single image.</p>
  
  <p>The Call</p>
  
  <pre><code>var t = new FormData();
  t.append('file-', file.id);
  t.append('filename', file.name);
  t.append('Size', file.size);
  
  $.ajax({
      url: sf.getServiceRoot('mySite') + "upload/PostFormData",
      type: "POST",
      data: t,
      contentType: false,
      processData: false,
      beforeSend: sf.setModuleHeaders
  }).done(function (response, status) {
      alert(response);
  }).fail(function (xhr, result, status) {
      alert("error: " + result);
  });
  </code></pre>
  
  <p>});</p>
  
  <pre><code>public async Task&lt;HttpResponseMessage&gt; PostFormData()
      {
          // Check if the request contains multipart/form-data.
          if (!Request.Content.IsMimeMultipartContent())
          {
              throw new HttpResponseException(HttpStatusCode.UnsupportedMediaType);
          }
  
          string root = HttpContext.Current.Server.MapPath("~/App_Data");
          var provider = new MultipartFormDataStreamProvider(root);
  
          try
          {
              // Read the form data.
              await Request.Content.ReadAsMultipartAsync(provider);
  
              // This illustrates how to get the file names.
              foreach (MultipartFileData file in provider.FileData)
              {
                  Trace.WriteLine(file.Headers.ContentDisposition.FileName);
                  Trace.WriteLine("Server file path: " + file.LocalFileName);
              }
              return Request.CreateResponse(HttpStatusCode.OK);
          }
          catch (System.Exception e)
          {
              return Request.CreateErrorResponse(HttpStatusCode.InternalServerError, e);
          }
      }
  </code></pre>