title: AJAX not sending image file to server
body: <p>So this ajax code:</p>
  
  <pre><code>var btn = $("input[name=submitname]");
          var url = btn.parents("form").attr("action");
              var fileName = btn.parents("form").find("input[type=file]").attr("name");
              var fileVal = btn.parents("form").find("input[type=file]").val();
          var dataString = btn.parents("form").serialize() + "&amp;" + btn.attr("name") + "=" + btn.val() + "&amp;" + fileName + "=" + fileVal;
              $.ajax({
                  url: url,
                  type: "POST", 
                  data: dataString, 
                  processData: false,
                  contentType: false,
                  cache: false,
                  success: function(data){
                      console.log(data);
                  }, error: function(errData){
                      console.log("error:");
                      console.log(errData);
                  }
              });
  </code></pre>
  
  <p>doesn't seem to be sending the file to the server.
  What am I doing wrong?</p>