Вывод списка по клику

[Сэмми]

через Ул-Ли пробовали?

[Kef1r]

Спасибо. В общем теперь по клику из списка <li> формируется еще один список <select>, все работает. Но, я хочу сделать, чтобы по выбранному элементу в <select> формировался еще один список <select>.
Тоесть схема работы такая: [Кликаю по списку]-->[Формируется список]-->[Выбираю элемент в новом списке]-->[Формируется еще 1 список].
И я не могу понять как мне это реализовать.
Допустим, я получаю ID элемента в атрибут value в command2.php

while ($row = $query->fetch()) {
        echo "<option value='{$row->ID}'>{$row->Name}</option>";
    }

И далее этот ID необходимо передать в скрипт:

           $(function(){
                $(".list").change(function(){
                    var ID=$(".list").val(); // и вот я типа передал

                    $.ajax({
                        type:"POST",
                        url: "select2.php",
                        data:{ID:ID},
                        success:function(data){
                            $(".slave").html(data);  
                        }
                    });
                });
            });

НО, я не понимаю к какому файлу мне подключать этот скрипт, к главному index.php или к command2.php
Если вы меня поняли, то подскажите пожалуйста, как это можно реализовать?

[Andkorol]

Ну у тебя же в index все списки отображаются – там и прописывай обработчик для второго списка.
command2 – это просто формирование и передача второго списка.
А все действия с ним – происходят уже в index.

[Kef1r]

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

Ну у тебя же в index все списки отображаются – там и прописывай обработчик для второго списка.
command2 – это просто формирование и передача второго списка.
А все действия с ним – происходят уже в index.

Да, я так сразу и подумал, но проблема в том, что select2.php не получает ID.
А не получает он его скорее всего потому, что ID я получаю в command2.php, а не в index. Вот в этом вся загвоздка. Не могу понять как решить

[Andkorol]

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

select2.php не получает ID.
А не получает он его скорее всего потому, что ...

Опять 25...
Чего гадать-то – когда в браузере есть консоль и вкладка Network..?
Всё ж легко и просто отдебажить.

[Kef1r]

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

Опять 25...
Чего гадать-то – когда в браузере есть консоль и вкладка Network..?
Всё ж легко и просто отдебажить.

Ну вот смотрите, жму я на первый список, выполняется command2.php и появляется второй список(select). Как это выглядит на вкладке network показано на первом скрине.
Далее выбираю один из элементов списка select и выполняется select2.php. Скрин вкладки network также прикладываю. В консоли ошибок нет.
И какие выводы из этой информации я могу сделать?

[Andkorol]

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

И какие выводы из этой информации я могу сделать?

Такие, что на втором скрине глазами же видно, что в select2 ID не передаётся.
Это происходит потому, что второй список был добавлен в тело страницы динамически – и поэтому он отсутствует в изначальном DOM-дереве, с которым работает jQuery.
Это значит, что обработать событие с его участием так просто через .change() не получится.
Значит, нужно просто создать функцию, которая будет обращаться к элементам на странице, которые существуют непосредственно на момент её вызова – а не в изначальном DOM страницы.
Объяснять это долго – поэтому вот простой пример для разбора:
index.php:

<select id="list1" onchange="getList(this.id, 'list2block', 1);">
    <option value="0">-- Select 1 --</option>
    <option value="1">List 1 1</option>
    <option value="2">List 1 2</option>
    <option value="3">List 1 3</option>
</select>

<div id="list2block" style="margin-top: 25px"></div>
<div id="list3block" style="margin-top: 25px"></div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script type="text/javascript">

    /**
     * получение связанного списка
     * @param  {[type]} id           ID текущего списка для получения его значения
     * @param  {[type]} target_id    ID элемента, в который будет помещён новый список
     * @param  {[type]} list         контрольный идентификатор текущего списка – для подгрузки различных по структуре или запросам к БД списков
     */
    function getList(id, target_id, list){
        $.post(
            '/lists/select.php',
            {
                list: list,
                ID: $('#'+id).val()
            },
            function(data){
                $('#'+target_id).html(data);
            },
            'html'
        );
    }

</script>

select.php:

PHP код:

<?php
$html = 'No data';
if (!empty($_POST['ID']) && ($_POST['list'] == 1)) {
    $html = '<select id="list2" onchange="getList(this.id, \'list3block\', 2)">';
    $html .= '<option value="0">-- Select 2 --</option>';
    $html .= '<option value="1">List 2 1</option>';
    $html .= '<option value="2">List 2 2</option>';
    $html .= '<option value="3">List 2 3</option>';
    $html .= '</select>';
}
elseif (!empty($_POST['ID']) && ($_POST['list'] == 2)) {
    $html = '<select id="list3">';
    $html .= '<option value="0">-- Select 3 --</option>';
    $html .= '<option value="1">List 3 1</option>';
    $html .= '<option value="2">List 3 2</option>';
    $html .= '<option value="3">List 3 3</option>';
    $html .= '</select>';
}
echo $html;
?>

[Kef1r]

Andkorol, спасибо вам большое за уделенное время на мою проблему. Очень помогли.