Рекурсивная функция js без settimeout

Question

Я пытаюсь переписать PHP-функцию, которая работает, в javascript, потому что мне нужно сделать работу со стороны браузера и добавить обработчики событий к объектам, которые я надеюсь добавить на свою страницу.

Функция принимает массив узлов с родительскими отношениями с дочерними элементами, смотрит на узел, потом на его дочерние элементы, а затем на дочерние дочерние элементы и т. Д. (Пока не найдет конец дерева).

Функция рабочего PHP:

//print nodes 
function display_child_nodes($parent_id, $level) { 
global $task_list, $index; 
    if(isset($index[$parent_id])) 
     { 
      foreach ($index[$parent_id] as $id) { 
       echo str_repeat("-", $level) . $task_list[$id]["title"] . "<br />"; 
       display_child_nodes($id, $level + 1); 
      } 
     } 
} 
display_child_nodes(0, 0); 

Результат функции PHP выглядит следующим образом:

B

-C

-D

- E

F

G

Это Javascript, который я пытался писать, но я подозреваю, что вызов функции show_child_nodes образуют в том, что функция не корректные JS ...

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

javascript получает json-массив из php-скрипта, содержит список узлов (задач) и их деталей и массив order_index, который структурирован [parent_id1 => array [1,2,3], parent_id2 => [4,5], parent_id3 => [6,7,8]] и т. Д., Как и в, каждый parent_id является ключом с его дочерними идентификаторами в качестве значения.

Вот JSON:

{"tasks":{"2":{"id":"2","title":"Task 2","desc":"Task 2 description","parent_id":"0"},"6":{"id":"6","title":"Task 6","desc":"Task 6 description","parent_id":"0"},"1":{"id":"1","title":"Task 1","desc":"Task 1 description","parent_id":"2"},"3":{"id":"3","title":"Task 3","desc":"Task 3 description","parent_id":"1"},"4":{"id":"4","title":"Task 4","desc":"Task 4 description","parent_id":"1"},"5":{"id":"5","title":"Task 5","desc":"Task 5 description","parent_id":"3"}},"order_index":{"0":["2","6"],"2":["1"],"1":["3","4"],"3":["5"]}} 


      $.getJSON("get_items_hierarchy.php",function(data,status){ 

       var order_index = data.order_index; 
       var tasks = data.tasks; 
       var output = []; 

       function show_child_nodes(parent_id,level){ 
        if(order_index[order_index[parent_id]]) 
         { 
          $.each(order_index[parent_id],function(index,id){ 
           var margin = level * 40; 
           output.push('<div style="float: left; clear: left; margin-left: ' + margin + 'px">' + tasks[id]['title'] + '</div> '); 
           show_child_nodes(id, level + 1); 
          }); 
         } 
       } 
       show_child_nodes(0,0); 

      $.each(output,function(index,line){ 
       $("#tasks").append(line); 
      }); 

    }); 

Answer 1

Это, кажется, чтобы исправить это.

Демо:

Изменить эту строку:

if(order_index[order_index[parent_id]]) 

к:

if(order_index[parent_id]) 

Answer 2

Я не вижу ничего плохого в Алгоритм Построения сама, но следующая часть м, вероятно, будет проблема:

$.each(output, function(index,line){ 
    $("#tasks").append(line); 
}); 

Этот код ссылается на значение output, но:

1. $.getJSON является асинхронным, так что значение не будет готов все же.

2. Переменная доступна только внутри обратного вызова AJAX.

Код должен быть помещен в конце функции обратного вызова AJAX.

Как отметил другой ответ, это утверждение, вероятно, неправильно:

if (order_index[order_index[parent_id]]) 

Это может быть просто опечатка, но скорее всего, правильный код:

if (order_index[parent_id])