Добавленные элементы не отображают ПРОБЛЕМУ CSS JAVASCRIPT PHP

#javascript #php #html

#javascript #php #HTML

Вопрос:

У меня возникли некоторые проблемы с извлечением внуков из моей таблицы db: рефералы. Однако, похоже, что мой код действительно может извлекать имя пользователя моих внуков. Но он не отображается под моей дочерней строкой, и при проверке нет ошибки.

Пожалуйста, посмотрите на ВЫХОДНЫЕ изображения, которые я прикрепил здесь: Здесь прикреплены изображения выходных данных моего кода:

ВЫВОД

Это ОБНОВЛЕННОЕ имя таблицы базы данных referals: введите описание изображения здесь

Я использовал Javascript для извлечения данных внутри таблицы «ссылки»

 <!-- GENEOLOGY TREE -->
    <div class="tree">
       <?php $id = 1; ?>
          <ul>
             <li>
               <div id="parent_account"><a href="#"><img src="user.png" alt="Avatar" style="width:50px"/></br>Parent<?php echo $id; ?></a></div>
             </li>
        </ul>
      </div>
<!-- END OF GENOLOFY TREE -->


  <script>
$(document).ready(function(){
    // start get children
    var _id = "<?php echo $id ?>";
    var child = "";
    var child_id = [];
    var gchild_id = [];
    var count = 0;

    $.post('get_child_referrals.php', { id:_id }).done(function(response){
        var response = jQuery.parseJSON(response);
        var referred = response["referred"];
        var referred_len = response["referred"].length;
        if(referred_len > 0){
            child  = "<ul>";
            for(var x = 0; x < referred_len; x  ) {
                console.log(referred[x]["usernamee"]);
                count  = 1;
                child_id[x] = referred[x]["id"];
                child  = "<li id='child" x "'><a href=" x "><img src='user.png' alt='Avatar' style='width:50px'/><br>Child " referred[x]["usernamee"] "</a></li>";
            }
            child  = "</ul>";
            console.log(child);
            $("#parent_account").append(child);
            // start get grandchildren
        // console.log(child_id);
        var gchild_len = child_id.length;
        // console.log(gchild_len);
        for(i = 0; i < gchild_len; i  ){
            gchild = "";
            _id = child_id[i];
            // console.log(_id);
            $.post('get_child_referrals.php', { id:_id }).done(function(response){
                gresponse = jQuery.parseJSON(response);
                greferred = gresponse["referred"];
                greferred_len = gresponse["referred"].length;
                if(greferred_len > 0){
                    gchild  = "<ul>";
                    for(y = 0; y < greferred_len; y  ) {
                        gchild_id[y] = greferred[y]["id"];
                        console.log(greferred[y]["usernamee"]);
                        gchild  = "<li id='gchild" y "'><a href=" y "><img src='user.png' alt='Avatar' style='width:50px'/><br>Child " greferred[y]["usernamee"] "</a></li>";
                    }
                    gchild  = "</ul>";
                    console.log($("#child" i).length);
                    console.log(gchild);
                    $("#child" i).append(gchild);
                }
            });
        }
        // end get grandchildren
        }
    });
    // end get children
});
</script>  

get_child_referrals.php

 include('connectdb.php');
$response = array();
$response["referred"] = array();
$id = $_POST['id'];
$sql = "SELECT * FROM referrals WHERE referral_id='$id'"; // MY RECRUITERS
$result = $conn->query($sql);
while($data = $result->fetch_assoc()) {
                array_push($response["referred"], $data);
}
echo json_encode($response);
  

Для получения дополнительной информации, это мои журналы на моей консоли проверки:
введите описание изображения здесь

Комментарии:

1. Что вы пытались сузить проблему? Успешно ли выполнен AJAX-запрос? Содержит ли он ожидаемые данные?

2. Да, ajax запущен успешно. Я также могу видеть имя пользователя моего внука, которое является «внуком 1 дочернего элемента 1» и «внуком 2 дочернего элемента 1» в INSPECT. Итак, да, он содержит ожидаемые данные @NicoHaase

3. Я обновил свой пост и вставил картинку, содержащую мои журналы, в свою консоль. Спасибо. @NicoHaase

4. можете ли вы сделать консольный журнал child и gchild переменных в строке непосредственно перед добавлением, чтобы убедиться, что у вас есть правильные элементы?

5. Привет. Я обновил свой пост, я добавил журнал консоли для дочерних элементов и gchild перед строкой добавления. Я получил правильные элементы для внуков @PaddyHallihan

Ответ №1:

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

console.log($ (дочерний));

Я попробовал ваш код в моем локальном и получил результат, как на рисунке.Проверьте, хотите ли вы получить это.

введите описание изображения здесь

Комментарии:

1. Привет. Я обновил свой пост, я добавил журнал консоли для дочерних элементов и gchild перед строкой добавления. Я получил правильные элементы для внуков

2. Привет. Да, это так, также мне нужно увидеть внуков детей

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

4. Я попытался изменить его на console.log($ (дочерний)); как вы сказали. И обновил изображение журнала консоли в моем сообщении

Ответ №2:

Итак, глядя на вашу консоль, эта строка, console.log($("#child" i).length); похоже, возвращает 0 , что означает, что рассматриваемый элемент, похоже, не существует.

Можете ли вы зарегистрировать это без .length и убедиться, что он все еще получает правильный элемент.