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

[Kef1r]

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

<ul >
            <span class="tree">
        <?php  
            $query=$db->query("SELECT  * FROM `dbdeviceuniversalitem` WHERE `ParentType`=59");
            while ($row=$query->fetch())
            {
            echo "<li><span value='{$row->ID}'>".$row->Name."</span></li>";
            }
        ?>
            </span>
        </ul>

Сюда типа должен выводиться список после нажатия

<span class="list">
 
    </span>

Скрипт:

<script type="text/javascript">
            $(function(){
                var ID=$(".tree").val(); 
                $.ajax({
                        type:"POST",
                        url:"command2.php",
                        data:{ID:ID},
                        success:function(data){
                            $(".list").html(data);
                        }
                    });
 
                $(".tree").click(function(){
                    var ID=$(".tree").val();
 
                    $.ajax({
                        type:"POST",
                        url: "command2.php",
                        data:{ID:ID},
                        success:function(data){
                            $(".list").html(data);
                        }
                    });
                });
            });
        </script>

command2.php

<?php
require_once 'connection.php';
if (isset($_POST['ID'])&& !empty($_POST['ID']) ){
    $ID=intval($_POST['ID']);
    $query =$db->query("SELECT * FROM `dbobjectmainclass` WHERE `MainID_Ref`=$ID");
        echo "<select size='15' name='list'>";
        echo "<option value='0'>Выберите объект</option>";
    while ($row = $query->fetch()) {
        echo "<option >{$row->Name}</option>";
    }
    echo "</select>";
}else{
    echo "<option value='0' disabled>Выберите объект</option>";
}
 
?>

По клику список не формируется и срабатывает условие, else в command2.php:

else{
    echo "<option value='0' disabled>Выберите объект</option>";
}

Нужна помощь

[Andkorol]

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

<ul >
            <span class="tree">
        <?php  
            $query=$db->query("SELECT  * FROM `dbdeviceuniversalitem` WHERE `ParentType`=59");
            while ($row=$query->fetch())
            {
            echo "<li><span value='{$row->ID}'>".$row->Name."</span></li>";
            }
        ?>
            </span>
        </ul>

...
Скрипт:

var ID=$(".tree").val();

У элементов типа span, ul, div, etc... – у них в принципе не может быть атрибута value, значение которого ты пытаешься поймать через .val() и отправить на сервер.
Поэтому, через .val() ты получаешь ничего – и это самое ничего передаёшь на сервер, который и реагирует соответственно.
В консоли браузера, скорее всего, есть замечания по этому поводу – иногда полезно туда заглядывать, а также выводить туда для проверки значения переменных, если в процессе разработки что-то идёт не так (console.log(var_name)).

[Kef1r]

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

В консоли браузера, скорее всего, есть замечания по этому поводу – иногда полезно туда заглядывать, а также выводить туда для проверки значения переменных, если в процессе разработки что-то идёт не так .

Спасибо большое, теперь хоть понятно, в консоли ошибок небыло, иначе я бы разобрался быстрее.
Теперь хочу спросить, у каких элементов кроме select и button есть атрибут value?
Или может быть есть какой-то другой выход из этой ситуации?)

[Kef1r]

Еще интересное наблюдение: Если отправлять в атрибут value элемента span строковое значение, то оно таки туда присваивается. Например я присвоил значение столбца Name

<span value='{$row->Name}'></span>

.
А если числовое, как я пытался ID и другие, то ничего не присваивается.

[Andkorol]

Задать элементу списка id, который будет содержать нужное для передачи на сервер значение в той или иной форме (например: <span id="tree_{$row->ID}">).
Затем отслеживать клик по этим элементам – и передавать на сервер id текущего (this.id).
Ну а на сервере уже извлекать из "tree_{$row->ID}" собственно нужную часть строки.
Можно и сразу на клиенте извлечь – при помощи split, и на сервер передавать уже «чистый» ID.
Можно data-* атрибуты использовать.
Варианты есть.

[Kef1r]

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

Варианты есть.

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

[Andkorol]

Попытки в студию.

[Kef1r]

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

Попытки в студию.

Пробовал вот так. PHP:

<ul class="tree">
          
        <?php  
            $query=$db->query("SELECT DISTINCT `Name` FROM `dbdeviceuniversalitem` WHERE `ParentType`=59");
            while ($row=$query->fetch())
            {
            echo "<li ><span id='{$row->ID}'>".$row->Name."</span></li>";
            }
        ?>
 
         </ul>

Script:

$(".tree li span").click(function(){
    var ID=$(this).attr("id");

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

Но так даже не выполняется событие click().

[Andkorol]

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

Но так даже не выполняется событие click().

Я ж надеюсь, ты догадался по своему предыдущему коду, что код обработки события click нужно заключить в:
jQuery(document).ready(function($){ });
или
$(function(){ });
?
Всё там нормально выполняется: http://jsfiddle.net/1hywce8s/

[Kef1r]

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

Всё там нормально выполняется

Да, это я заметил, но тут дело опять в том, что ID не передается в command2.php

Вот, если что, полный код на данный момент:
PHP:

<ul class="tree">
          
        <?php  
            $query=$db->query("SELECT DISTINCT `Name` FROM `dbdeviceuniversalitem` WHERE `ParentType`=59");
            while ($row=$query->fetch())
            {
            echo "<li ><span id='{$row->ID}'>".$row->Name."</span></li>";
            }
        ?>
 
        </ul>

Script:

$(function(){
$(".tree li span").click(function(){
    var ID=$(this).attr("id");

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

command2.php:

<?php
require_once 'connection.php';
if (!empty($_POST['ID']) ){
    echo $_POST['ID'];
}
if (isset($_POST['ID'])&& !empty($_POST['ID']) ){
    $ID=intval($_POST['ID']);


    $query =$db->query("SELECT * FROM `dbobjectmainclass` WHERE `MainID_Ref`=$ID");
        echo "<select size='15' name='list'>";
        echo "<option value='0'>Выберите объект</option>";
    while ($row = $query->fetch()) {
        echo "<option >{$row->Name}</option>";
    }
    echo "</select>";
}else{
    echo "<option value='0' disabled>Выберите объект</option>";
}

?>

По прежнему выполняется условие else в command2.php
Хелп)