Как отправить картинку через ajax
Есть форма:
<form class="register_form" action="" method="post" name="reg_form" enctype="multipart/form-data">
<input type="text" placeholder="Фамилия" name="last_name" id ="last_name" required>
<input type="text" placeholder="Имя" name="first_name" id="first_name" required>
<input type="text" placeholder="Отчетсво" name="middle_name" id ="middle_name">
<input type="text" placeholder="Телефон" pattern="0-9]" name ="phone_number" id = "phone_number" required>
<input type="email" placeholder="Ведите email" name = "email" id = "email" required>
<input type="text" placeholder="Отдел" name="department" id = "department" required>
<input type="text" placeholder="Логин" pattern="[a-zA-Z0-9]+" name = "login" id = "login" required>
<input type="password" placeholder="Пароль" name="password" id = "password" required>
<div style = "color: #bd3c2e;" id="errorBlock">aaa</div>
<button type = "button" class="adduserbtn" value="reg" name="reg" id = "reg">Добавить пользователя</button>
<div class="file-upload">
<label for="file-input">
<img class="addfile" src="./img/avatar.png">
</label>
<input id="file-input" type="file" name ="avatar" />
</div>
</form>
И есть ajax скрипт отправки этой формы
$('#reg').click(function() {
var login = $('#login').val();
var password = $('#password').val();
var first_name = $('#first_name').val();
var last_name = $('#last_name').val();
var middle_name = $('#middle_name').val();
var email = $('#email').val();
var phone_number = $('#phone_number').val();
var department = $('#department').val();
$.ajax({
url: 'processing/registration.php',
type: 'POST',
cache: false,
data: {login, password, first_name, last_name, middle_name, email, phone_number, department},
dataType: 'html',
success: function(data){
if(data == 'Готово'){
$('#errorBlock').text(data);
}else{
$('#errorBlock').text(data);
}
}
});
});
Если с отправкой текста я разобрался, то с отправкой картинки/файла не получилось. Подскажите пожалуйста, что мне нужно сделать для отправки file-input