Why the change in input type=file is not identified with `form.serialzie()`

Question

I am checking whether the values in form has been changed before submitting for updation. All other controls inside form, if changed, are identified but not input type=file control. Below is the sample I was trying and if you try submitting form with or without uploading file, the response is its not changed. Why this behavior with only input type=file? Why the change in input type=file is not identified?

var form_serialize = "";
$(function() {
  form_serialize = $("#frmProfile").serialize();
})

$('.submit').on('click', function(e) {
  e.preventDefault();
  var isChanged = $("#frmProfile").serialize() == form_serialize ? false : true;
  if (isChanged)
    $('body').append('changed');
  else
    $('body').append('Not changed');
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="frmProfile">
  <input type="file" />
  <input type="submit" class="submit" value="Submit" />
</form>

Answer 1

As per the documentation of serialize()

Data from file select elements is not serialized.

Instead you can use jQuery ajaxForm plugin which support.

Or you can use FormData object , Refer these questions : Jquery/Ajax Form Submission (enctype="multipart/form-data" ). Why does 'contentType:False' cause undefined index in PHP? , Sending multipart/formdata with jQuery.ajax