Динамическое изменение Select'a

@Neznayka_Sh · Регистрация: 05.10.2017

Студворк — интернет-сервис помощи студентам

Здравствуйте!

У меня есть 2 select'a, выбор тома и выбор главы. Нужно подсчитать количество томов, в данном произведении и дальше в зависимости от тома подсчитать количество папок внутри и добавить в select нужное количество <option> для выбора главы.
Как подсчитать количество томов я разобрался, а вот как считать выбранный том и подстроить под него главы в пхп я вообще не понимаю.
По идее через js проще, но разве js сможет подсчитать папки на сервере, это же клиентский язык...

Спасибо, за ваше время.

@atanov · 15.07.2019, 07:23

Neznayka_Sh, а где хранится информация о кол-ве томов и папок?

@Neznayka_Sh · 15.07.2019, 10:44 **[ТС]**

Есть только папки на сервере, томы я подсчитал с помощью пхп.
А куда-то нужно записать информацию о томах и главах?

@atanov · 15.07.2019, 11:01

Neznayka_Sh, как папки - каталоги на сервере связаны с томами?

Сообщение от Neznayka_Sh

А куда-то нужно записать информацию о томах и главах

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

@Neznayka_Sh · 15.07.2019, 11:04 **[ТС]**

У меня в бд есть путь к каталогу, где лежат тома. А Вы имеете ввиду, что нужно записывать в бд количество томов и глав в них?

@atanov · 15.07.2019, 11:07

Сообщение от Neznayka_Sh

где лежат тома

что и себя представляют тома?

Сообщение от Neznayka_Sh

что нужно записывать в бд количество томов и глав в них

это пока не очевидно.

@Neznayka_Sh · 15.07.2019, 11:11 **[ТС]**

Том - это просто папка на сервере, а внутри неё ещё такие же папки уже с главами, а внутри них картинки.

@atanov · 15.07.2019, 11:35

Сообщение от Neznayka_Sh

Том - это просто папка на сервере, а внутри неё ещё такие же папки уже с главами, а внутри них картинки.

т.е. всё это папки? Картинки это файлы? Теоретически можно сделать так: первый селект - при выборе в нём определенного option отправить запрос на сервер, серверный скрипт возьмёт is_dir'ом список подкаталогов и вернёт на клиент. На клиенте эту информацию распихать в новосозданный select.

@Neznayka_Sh · 15.07.2019, 11:44 **[ТС]**

Теория - это хорошо) А как при выборе option отправить сразу запрос, без submit'a? Событие сделать?
И как потом с php обратиться к js?
Просто я раньше пробовал подсчитать папки в php файле, а дальше записать в переменную в js файле подобным образом:

JavaScript
1
var a = '<?=countTom ?>'

. Но у js файла не было доступа к 'countTom'.

@atanov · 15.07.2019, 12:04

Сообщение от Neznayka_Sh

Теория

никакой теории, голая практика

Сообщение от Neznayka_Sh

А как при выборе option отправить сразу запрос, без submit'a

ajax'ом

Сообщение от Neznayka_Sh

а дальше записать в переменную в js файле подобным образом

нууу... Не стоит.
Вот Вам простейший пример, как можно реализовать:

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
    <select>
        <option>Том 1</option>
        <option>Том 2</option>
        <option>Том 3</option>
    </select>
    <div class = "divResult"></div>
</body>
</html>
<script src = "218.js"></script>

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
document.addEventListener('DOMContentLoaded', docReady);
function docReady()
{
    
    document.getElementsByTagName('select')[0].addEventListener('change', requestVolumeInfo);
}
function requestVolumeInfo()
{
    let requestToServer = new XMLHttpRequest();
    requestToServer.open('POST', '218.php', true);
    requestToServer.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    requestToServer.send('volume=' + document.getElementsByTagName('select')[0].value);
    requestToServer.addEventListener('readystatechange', serverReply);
    function serverReply()
    {
        if(requestToServer.readyState == 4)
        {
            document.getElementsByClassName('divResult')[0].innerHTML = requestToServer.responseText;
        }
    }
}

PHP
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<?php
switch($_POST['volume'])
{
    case 'Том 1':
        //собираете названия подкаталогов в папке Том 1 и выводите например echo'ом 
        echo '<select><option>подкаталог Тома 1</option></select>';
        //подкаталоги циклом в option'сы
    break;
    case 'Том 2':
        //собираете названия подкаталогов в папке Том 2 и выводите например echo'ом
        echo '<select><option>подкаталог Тома 2</option></select>';
    break;
    case 'Том 3':
        //собираете названия подкаталогов в папке Том 3 и выводите например echo'ом
        echo '<select><option>подкаталог Тома 3</option></select>';
    break;
}
?>

@alexsamos33 · 17.07.2019, 00:25

JS клиентский, но он может сделать запрос на сервер и получить с него данные. И всё это без перезагрузки страницы. Тебе нужен Ajax,
который будет срабатывать по событию onchange в select.

Новые блоги и статьи Все статьи Все блоги /
SDL3 для Web (WebAssembly): Реализация движения на Box2D v3 - трение и коллизии с повёрнутыми стенами 8Observer8 20.02.2026 Содержание блога Box2D позволяет легко создать главного героя, который не проходит сквозь стены и перемещается с заданным трением о препятствия, которые можно располагать под углом, как верхнее. . .	Конвертировать закладки radiotray-ng в m3u-плейлист damix 19.02.2026 Это можно сделать скриптом для PowerShell. Использование . \СonvertRadiotrayToM3U. ps1 <path_to_bookmarks. json> Рядом с файлом bookmarks. json появится файл bookmarks. m3u с результатом. # Check if. . .	Семь CDC на одном интерфейсе: 5 U[S]ARTов, 1 CAN и 1 SSI Eddy_Em 18.02.2026 Постепенно допиливаю свою "многоинтерфейсную плату". Выглядит вот так: https:/ / www. cyberforum. ru/ blog_attachment. php?attachmentid=11617&stc=1&d=1771445347 Основана на STM32F303RBT6. На борту пять. . .	Камера Toupcam IUA500KMA Eddy_Em 12.02.2026 Т. к. у всяких "хикроботов" слишком уж мелкий пиксель, для подсмотра в ESPriF они вообще плохо годятся: уже 14 величину можно рассмотреть еле-еле лишь на экспозициях под 3 секунды (а то и больше),. . .
И ясному Солнцу zbw 12.02.2026 И ясному Солнцу, и светлой Луне. В мире покоя нет и люди не могут жить в тишине. А жить им немного лет.	«Знание-Сила» zbw 12.02.2026 «Знание-Сила» «Время-Деньги» «Деньги -Пуля»	SDL3 для Web (WebAssembly): Подключение Box2D v3, физика и отрисовка коллайдеров 8Observer8 12.02.2026 Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами и вызывать обработчики событий столкновения. . . .	SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 11.02.2026 Содержание блога Библиотека SDL3 содержит встроенные инструменты для базовой работы с изображениями - без использования библиотеки SDL3_image. Пошагово создадим проект для загрузки изображения. . .

@Neznayka_Sh 1 / 1 / 0 Регистрация: 05.10.2017 Сообщений: 33

	Динамическое изменение Select'a 14.07.2019, 18:10. Показов 1968. Ответов 10 Метки нет (Все метки) Здравствуйте! У меня есть 2 select'a, выбор тома и выбор главы. Нужно подсчитать количество томов, в данном произведении и дальше в зависимости от тома подсчитать количество папок внутри и добавить в select нужное количество <option> для выбора главы. Как подсчитать количество томов я разобрался, а вот как считать выбранный том и подстроить под него главы в пхп я вообще не понимаю. По идее через js проще, но разве js сможет подсчитать папки на сервере, это же клиентский язык... Спасибо, за ваше время. 0

@atanov 640 / 481 / 172 Регистрация: 26.05.2016 Сообщений: 2,674
	15.07.2019, 07:23
	Neznayka_Sh, а где хранится информация о кол-ве томов и папок? 0

@Neznayka_Sh 1 / 1 / 0 Регистрация: 05.10.2017 Сообщений: 33
	15.07.2019, 10:44 [ТС]
	Есть только папки на сервере, томы я подсчитал с помощью пхп. А куда-то нужно записать информацию о томах и главах? 0

@Neznayka_Sh 1 / 1 / 0 Регистрация: 05.10.2017 Сообщений: 33
	15.07.2019, 11:04 [ТС]
	У меня в бд есть путь к каталогу, где лежат тома. А Вы имеете ввиду, что нужно записывать в бд количество томов и глав в них? 0

@Neznayka_Sh 1 / 1 / 0 Регистрация: 05.10.2017 Сообщений: 33
	15.07.2019, 11:11 [ТС]
	Том - это просто папка на сервере, а внутри неё ещё такие же папки уже с главами, а внутри них картинки. 0

@alexsamos33 669 / 640 / 335 Регистрация: 26.04.2014 Сообщений: 2,122
	17.07.2019, 00:25
	JS клиентский, но он может сделать запрос на сервер и получить с него данные. И всё это без перезагрузки страницы. Тебе нужен Ajax, который будет срабатывать по событию onchange в select. 1

Динамическое изменение Select'a

Решение