Привет всем.
Как чистить обычные импут поля, это я знаю, использую метод document.getElementById('formtexosmotr').reset()
А вот как быть с загрузкой файлов, я выбираю фаил и у меня надпись, выбрано фото: 1.
После отправки хочу эту надпись скидывать, как реализовать?
Кнопка для выбора фотки
<div class="input__wrapper">
<input type="file" name="file2" id="file2" class="input input__file">
<label for="file2" class="input__file-button">
<span class="input__file-icon-wrapper"><img class="input__file-icon" src="/media/img/add.svg" alt="Выбрать фото" width="25"></span>
<span class="input__file-button-text">Выберите <br />фото</span>
</label>
</div>
Скрипт для кнопки который подсчитает сколько выбрал фото
<script>
//показывает сколько фоток выбрано в кнопке
let inputs = document.querySelectorAll('.input__file');
Array.prototype.forEach.call(inputs, function(input) {
let label = input.nextElementSibling,
labelVal = label.querySelector('.input__file-button-text').innerText;
input.addEventListener('change', function(e) {
let countFiles = '';
if (this.files && this.files.length >= 1)
countFiles = this.files.length;
if (countFiles)
label.querySelector('.input__file-button-text').innerText = 'Выбрано фото: ' + countFiles;
else
label.querySelector('.input__file-button-text').innerText = labelVal;
});
});
</script>
Валидашка
if (!errors) {
var data = $('#formtexosmotr').serialize();
var data = new FormData(this); //для передачи файлов
$.ajax({
url: 'pay.php',
type: 'POST',
processData: false, //для передачи файлов
contentType: false, //для передачи файлов
data: data,
success: function(res) {
if (res == 1) {
alert('Письмо отправлено, в ближайшее время Вам перезвонит менеджер.');
document.getElementById('formtexosmotr').reset() //отчистка полей в форме после отправки
$('#ajax-loader').hide(); //скрыть лоайдер
} else {
alert('Ошибка отправки, попробуйте повторить отправку позднее.');
}
},
error: function() {
alert('Ошибка!');
}
});
$('#ajax-loader').show(); //показывать лоадер пока идет процесс отправки
}
