Здравствуйте! Отправляю файл на сервер (локальный: vertrigo(apache)) с помощью AJAX и drag & drop HTML5. Файл записывается в папку, на страницу с AJAX возвращается ответ. Но если после выполнения AJAX перейти на страницу с php-скриптом, то массив $_FILES будет пустым.
index.html
<form action="upload_file.php" enctype="multipart/form-data" method="POST" class="test-form" id="tForm">
<!-- <input type="file" class="inp-file" name="file1" id="iFile"> -->
<input type="text" class="inp-file" name="textF" value="test">
<input type="submit" name="butSubmit" id="butSubmit" value="Отправить">
</form>
<div id="dnd" class="dnd"></div>
main.js
var form = document.getElementById( 'tForm' );
var inpFile = document.getElementById( 'iFile' );
var butSubmit = document.getElementById( 'butSubmit' );
var dnd = document.getElementById( 'dnd' );
var dropFiles = null;
var data = new FormData( form );
var xhr = new XMLHttpRequest();
data.append( 'par', 'val' );
xhr.open( 'POST', 'php.php', true );
xhr.send( data );
dnd.ondragstart = function(e){
e.preventDefault();
e.stopPropagation();
console.log( 'dragstart' );
}
dnd.ondragenter = function(e){
e.preventDefault();
e.stopPropagation();
console.log( 'dragenter' );
}
dnd.ondragover = function(e){
e.preventDefault();
e.stopPropagation();
console.log( 'dragover' );
}
dnd.ondragleave = function(e){
e.preventDefault();
e.stopPropagation();
console.log( 'dragleave' );
}
dnd.ondrag = function(e){
e.preventDefault();
e.stopPropagation();
console.log( 'drag' );
}
dnd.ondragend = function(e){
e.preventDefault();
e.stopPropagation();
console.log( 'dragend' );
}
dnd.ondrop = function(e){
e.preventDefault();
e.stopPropagation();
dropFiles = e.dataTransfer.files;
console.log( 'drop--- ' + dropFiles[0]['name'] );
data.append( 'azaza', dropFiles[0] );
}
form.onsubmit = function( e ){
e.preventDefault();
xhr.open( 'POST', 'upload_file.php', true );
xhr.send( data );
xhr.onreadystatechange = function() {
if (this.readyState != 4) return;
if (this.status != 200) {
alert( 'ошибка: ' + (this.status ? this.statusText : 'запрос не удался') );
return;
}
console.log( this.responseText );
form.submit();
}
}
upload_files.php
move_uploaded_file( $_FILES["azaza"]["tmp_name"], "u/" . $_FILES["azaza"]["name"] );
print_r( $_FILES );
echo '<br>';
echo $_FILES["azaza"]["name"];
Спасибо!
Современные инструменты для криптотрейдинга: как технологии помогают принимать решения
Апостиль в Лос-Анджелесе без лишних нервов и бумажной волокиты
Основные этапы разработки сайта для стоматологической клиники
Продвижение своими сайтами как стратегия роста и независимости