JavaScript — динамический массив в HTML Datalist

Question

JavaScript — динамический массив в HTML Datalist

Я хочу динамически обновить php код в этом списке данных, без перезагрузки всей страницы.

<form id="form1" action="1.5-unterseite-nach-Eingabe.php" method="post" enctype="multipart/form-data">
<tr>
<td>Lecture auswählen: </td>
<td><input list="files" name="unterlage"></td>
</tr>
<datalist id="files">
<?php

$files = array_diff( scandir("/srv/www/htdocs/share/"), array(".", "..") );
foreach ($files as $option) {
echo '<option value=\''.$option.'\'>';
}
?>
</datalist>

Я надеюсь, что вы можете помочь мне.

0

arrays html-datalist html5 javascript php

Решение

По вопросам рекламы [email protected]

Accepted Answer

Вы можете написать свою HTML-форму в файле «index.html». И использует интервалы javascript для запроса данных, которые предоставляет PHP в data.php. Псевдокод будет примерно таким:

// index.html

<html>
<form id="form1" action="1.5-unterseite-nach-Eingabe.php" method="post" enctype="multipart/form-data">
<tr><td>Lecture auswählen: </td><td><input list="files" name="unterlage"></td></tr>
<datalist id="files">
</datalist>
</form>
<script>
window.setInterval(function(){
function request_data(){
$.ajax({
url: 'data.php',
method: "post",
success: function (data) {
// Do something here
$("#files").html(data);
}
})
}
},2000); // 2 secends request a time
</scirpt
</html>

1

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

Не совсем уверен, какова ваша конечная цель.

Но одно из действий — установить метод AJAX GET, который вызывает этот фрагмент PHP в своем собственном файле. Соберите все возвращаемые данные и вставьте их на страницу, используя JS.

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

Чтобы получить данные с помощью AJAX, используйте нечто подобное:

<script>
$(document).ready(function(){
$.ajax({
url: 'URL_TO_PHP_FILE/scanFiles.php',
dataType: 'text',
success: function(data)
{
$("#files").html(data);
}
});
});
</script>

Теперь переместите ваш PHP-фрагмент в его собственный файл просто так:

$files = array_diff( scandir("/srv/www/htdocs/share/"), array(".", "..") );
foreach ($files as $option) {
echo '<option value=\''.$option.'\'>';
}
?>

Если вы хотите, чтобы ваше единственное эхо было в вашем вызове AJAX, вы должны быть в порядке.

Также убедитесь, что у вас есть библиотека jQuery, связанная с вашей страницей, чтобы вы могли использовать AJAX. Взгляните на jQuery немного подробнее. Это сделает вашу жизнь намного проще.

Вам также понадобится метод для выполнения вашего кода JS каждые несколько секунд или триггер на основе предыдущего взаимодействия с пользователем.

1

Источник