title: Where and how do I set the correct encoding when uploading files using xhr
body: <p>I am uploading image files, and I need them to work with accented characters - so I have made everything use <code>UTF-8</code>.</p>
  
  <p>I use this javascript function to upload them:</p>
  
  <pre><code>     $('#files').change(function(e) {
              var formData = new FormData();
              for (var i=0; i&lt;this.files.length;i++){
                  formData.append(this.files[i].name, this.files[i]);
              }
              var xhr = new XMLHttpRequest();
              xhr.onreadystatechange = function(e) {
                  if ( 4 == this.readyState ) {
                      showMessage("Uploaded.");
                  }
              };
              xhr.open('post', 'accoms/upload.jsp', true);
              xhr.send(formData);
          }, false);
  </code></pre>
  
  <p>So if I have a file named "Björk.jpg" for example, when I look at what gets sent to the server using FireFox Firebug it shows as:</p>
  
  <pre><code>Content-Disposition: form-data; name="BjÃ¶rk.jpg"; filename="BjÃ¶rk.jpg"
  </code></pre>
  
  <p>and that seems to be what the server receives.</p>
  
  <p>The encoding for the post shows as this:</p>
  
  <pre><code>Content-Type    text/html;charset=UTF-8
  </code></pre>
  
  <p>When I send regular form data input text in other forms, it sends, and the server receives, the word "Björk" correctly.</p>
  
  <p>Here is the server-side code in case its that:</p>
  
  <pre><code>mpp=new MultipartParser(request, 100000000);
  com.oreilly.servlet.multipart.Part part;
  FilePart fp=null;
  String fileName="";
  files=new ArrayList();
  while((part=mpp.readNextPart())!=null){
      if (part.isFile()){
          fp=(FilePart)part;
          fileName=fp.getFileName();
          File file=new File(fileName);
          long size=fp.writeTo(file);
                      files.add(file);
              }
  }
  </code></pre>
  
  <p>Any ideas?</p>
  
  <p>Thanks.</p>