title: jQuery Form with Paperclip
body: <p>I am using <a href="http://malsup.com/jquery/form/" rel="nofollow">jQuery Form</a> and <a href="https://github.com/thoughtbot/paperclip" rel="nofollow">Paperclip</a> to upload a file from browser to my Rails app.</p>
  
  <h1>Without jQuery form:</h1>
  
  <pre><code>params = {...
  "pic"=&gt;#&lt;ActionDispatch::Http::UploadedFile:0x007f9af9faf0f0
  ...}
  </code></pre>
  
  <h1>With jQuery form:</h1>
  
  <pre><code>params = {...
  "pic"=&gt;"my_file.png"
  ...}
  </code></pre>
  
  <p>I am using this code to enable plugin:</p>
  
  <pre><code>$('form').ajaxForm(function(){ alert('done'); });
  </code></pre>
  
  <h1>This is my form:</h1>
  
  <pre><code>&lt;form action="/users" method="POST" enctype="multipart/form-data"&gt;
    &lt;input type="file" name="user[avatar]"&gt;
  &lt;/form&gt;
  </code></pre>
  
  <h1>Update</h1>
  
  <p>jQuery form is sending data with <code>Content-Type:application/x-www-form-urlencoded</code>, when  I need 
  <code>Content-Type:multipart/form-data</code>. I noticed this comparing with jQuery Form official page.</p>
  
  <p>I change my jQuery form code:</p>
  
  <pre><code>...
  contentType: 'multipart/form-data',
  success:function(){ alert('done')
  ...
  </code></pre>
  
  <p>But content type remains in url encoded.</p>
  
  <p>I am not sure if this is related with multipart/form-data thing. How can I debug this problem?</p>