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

Question

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

<?php

$blacklist = array("one.jps", "two.txt", "four.html");
$files = array_diff(glob("*.*"), $blacklist);

foreach($files as $file)
echo "<div class='post'><a href='" . $_SERVER['PHP_SELF'] . "?file=" . $file . "'><p>" . $file . "</p></a></div>";if(!empty($_GET["file"]) && !in_array($_GET["file"], $blacklist) && file_exists($_GET["file"]))
$thesource = htmlentities(file_get_contents($_GET["file"]));

?>

<textarea rows="40" cols="100" placeholder="Source code of file" class="source"><?php if(!empty($thesource))echo $thesource; ?></textarea>

Приведенный выше код, который я использую echo, содержит все файлы, которые находятся внутри каталога (кроме тех, что находятся в черном списке). Когда пользователь щелкает этот файл, в текстовой области отображается исходный код (все содержимое этого файла).

Щелчок по файлу отобразит исходный код в текстовой области, но когда вы щелкнете по файлу, вы попадете на новую страницу, где исходный код отображается в текстовой области. Короче говоря, код работает, но вы отправлены на новую страницу. Как мне сделать так, чтобы все происходило на текущей странице, на которой вы находитесь.

Я считаю, что мне нужно будет использовать AJAX, но как мне это сделать?

Обратите внимание, что когда я говорю «файл», я говорю о файлах в каталоге, которые выводятся на страницу. Они вложены внутрь <р> </ p> элементы.

0

ajax ajaxform php

Решение

Другие решения

Других решений пока нет …

Источник

Accepted Answer

Используйте ajax для загрузки содержимого файла в текстовое поле.

НОТА

Я предположил, что у textarea есть id = «source» в этом примере.

url- вот URL страницы с параметрами получения, где отображается содержимое файла. например, http://example.com/get_file.php?file=abc.txt

function loadDoc()
{
var xmlhttp;
if (window.XMLHttpRequest)
{
xmlhttp=new XMLHttpRequest();
}
else
{
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("source").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET",url,true);
xmlhttp.send();
}

редактировать

Вам нужно добавить по щелчку событие для кнопки, чтобы вызвать вышеупомянутую функцию.

Вот, jsfiddle

0