Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > JavaScript: Общие вопросы > Доброй ночи. Нужна AJAX загрузка .txt в DIV

Автор: xcislav 4.11.2014, 06:33

Необходимо через AJAX грузить .txt файл на apache вебсервер а затем помещать в тег <DIV>.
Раньше был код обычной загрузки файла:

Код


<form action="upld.php" method="post" enctype="multipart/form-data">
<input type="file" name="filename">
<input type="submit" value="Ld">
</form>

Код


<?php
move_uploaded_file($_FILES["filename"]["tmp_name"], "./".$_FILES["filename"]["name"]);
?>

Останавливаться на нём не стоит. Начал переделывать обычную форму.

Код


<div id="iiii"> </div>
<form id="f">
<input type="file" name="filename">
<input type="submit" value="Ld">
</form>
<script>
var fd=new FormData(document.getElementById("f"));
j=new XMLHttpRequest();
j.open("POST", "upld.php",true);
j.send(fd);
j.onreadystatechange=function(){
  if (j.readyState==4 && j.status==200)
    {
    document.getElementById("iiii").innerHTML=j.responseText;
    }
  } 
</script>

Код


// upld.php - уже другой 
<?php
if (move_uploaded_file($_FILES["filename"]["tmp_name"], "./".$_FILES["filename"]["name"])) {
file_get_contents("./".$_FILES["filename"]["name"]);
}
?>

Вот этот:
http://xidev.tk/fl.php не рабочий

А это тот:
http://xidev.tk/upldform.php рабочий (старый, обычный)

Читал, что в новый File API FormData позволяет невыразимо просто загрузить файл.

Код


var fd=new FormData(document.getElementById("f"));
j.send(fd);

(этого не произошло)
Так же не происходит окончательный

Код


if (j.readyState==4 && j.status==200)

Размеры файла соблюдены в php.ini (даже сейчас увеличил post/file до полгигов), txt-файл 3 байта.

По примеру Progress Bar - можно ли рассчитывать на upload.progress помощь? Индикатор прогресса имеет большую функциональность, хотя мне всего лишь необходим последний ивент - успешной загрузки файла на сервер.

Проблема часто встречается - но это по поводу загрузки и Progress Bar. А по поводу моей - аналогов не нашлось (простых примеров).

Автор: _zorn_ 4.11.2014, 10:01

Для начала

Цитата

var fd=new FormData(document.getElementById("f"));
j.send(f);

Автор: xcislav 4.11.2014, 10:16

Цитата(_zorn_ @ 4.11.2014, 10:01)

Для начала
var fd=new FormData(document.getElementById("f"));
j.send(f);

Отличное начало.

Код


j.send(fd);

Удалил из шапки дополнительные ошибки и подправил суть вопроса.

Автор: _zorn_ 4.11.2014, 11:08

Продолжаем smile

1. <form id="f">
var fd=new FormData(document.getElementById("fd"));
2. У тебя яваскрипт выполняется при загрузке страницы, когда форма пустая.
3. Страница перегружается при субмите.
4. В скрипте загрузки нету echo
Итого

Код


<div id="iiii"> </div>
<form id="f" onsubmit="sendForm();return false;">
<input type="file" name="filename">
<input type="submit" value="Ld">
</form>
<script>
function sendForm()
{
var fd=new FormData(document.getElementById("f"));
j=new XMLHttpRequest();
j.open("POST", "upld.php",true);
j.send(fd);
j.onreadystatechange=function(){
  if (j.readyState==4 && j.status==200)
    {
    document.getElementById("iiii").innerHTML=j.responseText;
    }
  } 
  return false;
}
</script>

Код


<?php
echo 'TEST TEST OLOLO'; //для проверки
if (move_uploaded_file($_FILES["filename"]["tmp_name"], "./".$_FILES["filename"]["name"])) {
echo file_get_contents("./".$_FILES["filename"]["name"]);
}
?>

Ну и соответственно права на запись в директорию где скрипт лежит проверь.

Автор: xcislav 4.11.2014, 12:50

_zorn_, ☑ РЕШЕНО

Скрытый текст

Остановимся, пожалуй на рабочести тут.