Загрузка файла на сервер и получение его содержимого без перезагрузки страницы

[фонарик]

Доброго времени суток. Помогите, пожалуйста, разрешить проблему. Есть страница, на ней пользователь выбирает для загрузки на сервер файлик со своего компьютера. Этот файл должен загрузиться на сервер, а его содержимое (отредактированное) должно придти в ответе от сервера без перезагрузки страницы.
Проблема заключается в составлении ajax запроса на сервер. Облазил все интернеты, нашел решение через форму и фрейм, оно не подходит. Нашел решение при использовании jquery, я не программист, с этой библиотекой еще не познакомился. Нужно решение исключительно на javascript и ajax.
Вот страничка:

<input style=" position:absolute;top:65px; border:1px solid red" type="file" name="myfile">
<input style=" position:absolute;top:95px; border:1px solid blue" type="button" value="Загрузить" onclick="get_data_of_file()">
<div id="div_result" style="position:absolute;top:125px; border:1px solid purple">Здесь должно появиться содержимое загруженного файла.</div>

Скрипт на странице:

var request;
function CreateRequest(){
  var request=null;
  try {request = new XMLHttpRequest();}
  catch (e){
	  try{request=new ActiveXObject("Msxml2.XMLHTTP");}
  	  catch (e){request=new ActiveXObject("Microsoft.XMLHTTP");}
  }
  return request;
}

function get_data_of_file(){
	request=CreateRequest();
	if(request==null){return;}
	request.open("POST","upload.php",true);	
	request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");

//...

	request.onreadystatechange = 
	function(){
		if(request.readyState == 4 && request.status == 200){
			document.getElementById('div_result').innerHTML = request.responseText;
		}
	}
}

upload.php

$dir = '/uploads/';
$full_path = $_SERVER['DOCUMENT_ROOT'].$dir;
$file = $_FILES['myfile']['name'];
if(!is_dir($full_path)){
    mkdir($full_path,0777);
}
if(move_uploaded_file($_FILES['myfile']['tmp_name'],$full_path.$file)){
    readfile($full_path.$file);
}

[laimas]

Этот файл должен загрузиться на сервер, а его содержимое должно придти в ответе от сервера без перезагрузки страницы.

Зачем возвращать содержимое файла клиенту, который у него и так есть?

[фонарик]

Зачем возвращать содержимое файла клиенту, который у него и так есть?

Может я не так понял, когда гуглил, но вроде как загрузить, допустим, содержимое текстового файла в браузер напрямую нельзя

Бинарное содержимое?

Нет, просто содержимое, например, txt файла.

[laimas]

вроде как загрузить, допустим, содержимое текстового файла в браузер напрямую нельзя

Загрузка, это на сервер, а вы пишите о возврате клиенту содержимое загруженного, и что с ним будет делать клиент, тем более что вы возвращаете бинарные данные, да и не нужен он клиенту.

И так как вы производите загрузку на сервер, так поступать нельзя.

Насчет загрузки асинхронным способом, ну так возьмите готовый плагин, а их много, хоть чисто на JS, хоть на jQuery.

[фонарик]

laimas,
немного уточню суть того, что требуется. Клиент загружает на сервер текстовый файл. Этот текстовый файл на сервере редактируется и отправляется в исправленном виде обратно клиенту и вставляется в див блок. Вот как-то так.
На счет плагинов, мне не нужен расширенный функционал, мне нужно по минимуму. Для работы с плагинами я еще маленький

[laimas]

$dir = '/uploads/'; - это уже должно быть определено и быть
$full_path = $_SERVER['DOCUMENT_ROOT'].$dir; - а значит это есть
if(!is_dir($full_path)) - то есть это зачем?
$file = basename($_FILES['myfile']['name']); - а это обязательно

А загрузку файлов нужно начинать с проверки ошибок загрузки, и уж коли редактируете, значит сразу $_FILES['myfile']['tmp_name'] можно и использовать, а уже отредактированный сохранять и отдавать клиенту, причем клиенту пропустив через htmlspecialchars().

Для загрузки используйте объект FormData, в курсе такого?

[фонарик]

laimas,
ваши заметки учел, риторические замечания очень к месту )) Что такое объект FormData не знаю, пойду гуглить. Спасибо за наводку

[laimas]

ваши заметки учел

Учтите следующее - загрузку файлов всегда нужно проверять:

1) тип загруженного, то есть разрешенное для загрузки
2) устанавливая полные права на каталог 0777 при загрузке, после окончания работы с каталогом необходимо установить права 0755
3) каталог лучше не создавать if(!is_dir($full_path)) mkdir($full_path,0777);, а уже иметь определенный, в котором посредством .htaccess запретить выполнение сценариев. Если же есть необходимость в динамическом создании каталога, то он должен создаваться в уже имеющемся с запретом исполнения кода.

[Vlasenko Fedor]

но вроде как загрузить, допустим, содержимое текстового файла в браузер напрямую нельзя

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="X-UA-Compatible" content="IE=Edge" >
<script>
		function readFile() {
				var selectedFile = document.getElementById('inputFile').files[0];
				var reader = new FileReader;
				reader.onload = function (e) {
						parseContent(e.target.result);
				};
				reader.readAsText(selectedFile);
		}
		function parseContent(content) {
				alert(content);
		}
</script>
  </head> 
  <body>
     <input id="inputFile" type="file"  onchange="readFile()">
  </body>
</html>

А ведь можно FileReader позволяет

[pureJS]

фонарик, если решение через форму и FRAME не подходит, то можно через HTML5 Files API, как написал выше Poznakomlus. Об этом также подробно написано тут:
HTML5 Files API - чтение файлов

А можно ещё через Form Data. Об этом довольно подробно написано тут:
Особенности загрузки файлов на HTML5
Tам также описано как это всё на сервер отправить через AJAX.post - смотри конец статьи.

Кстати, у тебя неправильно ответ AJAX обрабатывается. Надо исправить на это:

if(request.readyState == 4)
{
    if(request.status == 200)
    {
    //............