How to upload file on ajax response - php

Question

I am playing with jQuery Ajax and I want to upload file to specific folder on ajax response.
My HTML Form:
<form type="post" method="post" action="" id="newCustomerForm" enctype="multipart/form-data">
<div>
<label for="username">Username</label>
<input name="username" id="username" type="text" />
</div>
<br />
<div>
<label for="email">Email</label>
<input name="email" id="email" type="text" />
</div>
<br />
<div>
<label for="message">Message</label>
<input name="message" id="message" type="text" />
</div>
<br />
<div>
<label for="file">File</label>
<input name="file" id="file" type="file" />
</div>
<br />
<input type="hidden" name="action" value="addCustomer"/>
<input type="submit" name="submit" value="Submit">
</form>
My Ajax Code:
<script type="text/javascript">
$(function() {
$("#newCustomerForm").validate({
rules: {
"username": {
required: true
}
},
messages: {
"username": {
required: "Please, enter a name"
}
},
submitHandler: function(form) {
$.ajax({
type: "POST",
url: "<?php echo esc_url( home_url( '/' ) ); ?>wp-admin/admin-ajax.php",
data: $(form).serialize()+'&file='+document.getElementById('file').value,
timeout: 3000,
success: function(data) {
$("#feedback").html(data);
},
error: function() {
alert('failed');
}
});
return false;
}
});
});
</script>
I am getting ajax data inside bellow function:
add_action('wp_ajax_addCustomer', 'addCustomer');
function addCustomer() {
echo $username = $_POST['username'];
echo "<br />";
echo $email = $_POST['email'];
echo "<br />";
echo $message = $_POST['message'];
echo "<br />";
echo $file = $_POST['file'];
echo "<br />";
die();
}
add_action('wp_ajax_nopriv_addCustomer', 'addCustomer');
I am getting file name on response but I am confused how to upload image to specific folder on my project folder.
I will appreciate If you help me to solve my issue.
Thanks :)