title: Sending formdata for file upload using ajax
body: <p>I am trying to upload an image by using form data with ajax. Though below line seems to be working fine and saving the image on my local machine.</p>
  
  <pre><code>&lt;form ref='uploadForm' id='uploadForm' action='/tab10/uploadImage' method='post' encType="multipart/form-data"&gt;
  &lt;input type="file" class="btn btn-default" name="file" /&gt;
  &lt;input type='submit' class="btn btn-default" value='Broadcast Image' /&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>But when instead of specifying action as a form attribute, i try to make the call using ajax, things didn't seem to be working fine.Below is the code that i am using to make the post API call using ajax.</p>
  
  <p>HTML</p>
  
  <pre><code>&lt;form ref='uploadForm' id='uploadForm' encType="multipart/form-data"&gt;
  </code></pre>
  
  <p>Jquery</p>
  
  <pre><code>$("form#uploadForm").submit(function (event) {
            //disable the default form submission
            event.preventDefault();
            var formData = $(this).serialize();
            console.log(formData);
            $.ajax({
                url: '/tab10/uploadImage',
                type: 'POST',
                data: formData,
                async: false,
                cache: false,
                contentType: false,
                processData: false,
                success: function () {
                    alert('Form Submitted!');
                },
                error: function(){
                    alert("error in ajax form submission");
                }
            });
            return false;
        });
  </code></pre>
  
  <p>Below is the code i am using for saving the image.</p>
  
  <pre><code>exports.uploadImage = function(req, resp) {
  var res = {};
  let file = req.files.file;
  file.mv('./images/image', function(err) {
  if (err) {
    res.status = 500;
    res.message = err;
    // return res.status(500).send(err);
    return resp.send(res);
  }
  res.status = 200;
  res.message = 'File uploaded!';
  return resp.send(res);
  });
  };
  </code></pre>
  
  <p>When i checked the request data in my uploadimage function, it seems that in the request, parameter called "files" is not being send in the later case.</p>