title: How can I upload images via jQuery Ajax using Grails webservice
body: <p>I have a webservice to upload files that is implemented via GRAILS.
  I can consume the web service using CURL using this command:</p>
  
  <pre><code>curl -X POST -H "Authorization: 53676c55f8014c5eb84624b49d9c9e74" -H "Content-Type: multipart/form-data" http://localhost:8080/project/api/profiles/11/uploadlogo -F "img=@c:/my_image.jpg"
  </code></pre>
  
  <p>How can I consume it using jQuery AJAX function?</p>
  
  <p>I did like so but it didnt work:</p>
  
  <pre><code>var files = [];
  
  $('input').change(function(e){            
      files = e.target.files;    
  });
  
  $('form').on('submit', function(e){
  
    e.stopPropagation();
    e.preventDefault();
  
    var data = new FormData();
    $.each(files, function(i, file) {
       console.log(file)
       data.append('img', $('input').val());
    });
  
    $.ajax({
      url: 'http://localhost:8080/hsp-main/api/profiles/11/uploadimage',
      contentType: 'false',
      type: 'post',
      processData: false,
      header: {
        "Authorization": '88db1ec45c3f4882859d59df45900fd5'
      },
      data: data
      }).done(function(response){
        console.log(response);
      }).fail(function(a, s, d){
        console.log(a, s, d);
      });
  
       return false;
  });
  </code></pre>