使用递归的动态菜单树

Question

I need help with the recursion in PHP. I need to create folder structure from the JSON. And this is how it will looks like,

{  
   "parent":{  
      "url":"parent.html",
      "name":"Parent",
      "children":[  
         {  
            "type":"folder",
            "name":"Folder 1",
            "url":"folder1.html",
            "children":[  
               {  
                  "type":"file",
                  "name":"File 1",
                  "url":"folder1-file1.html",
                  "children":[  

                  ]
               },
               {  
                  "type":"file",
                  "name":"File 2",
                  "url":"folder1-file2.html",
                  "children":[  

                  ]
               },
               {  
                  "type":"file",
                  "name":"File 2",
                  "url":"folder1-file3.html",
                  "children":[  

                  ]
               }
            ]
         },
         {  
            "type":"folder",
            "name":"Folder 2",
            "url":"folder2.html",
            "children":[  

            ]
         },
         {  
            "type":"folder",
            "name":"Folder 3",
            "url":"folder3.html",
            "children":[  
               {  
                  "type":"file",
                  "name":"Folder3 File1",
                  "url":"folder3-file1",
                  "children":[  

                  ]
               },
               {  
                  "type":"folder",
                  "name":"Folder3 Folder1",
                  "url":"folder3-file1",
                  "children":[  
                     {  
                        "type":"folder",
                        "name":"Folder3 Folder1 Folder1",
                        "url":"folder3-folder1-folder1",
                        "children":[  
                           {  
                              "type":"file",
                              "name":"Folder3 Folder1 Folder1 File1",
                              "url":"folder3-folder1-folder1-file1",
                              "children":[  

                              ]
                           },
                           {  
                              "type":"file",
                              "name":"Folder3 Folder1 Folder1 File2",
                              "url":"folder3-folder1-folder1-file2",
                              "children":[  

                              ]
                           }
                        ]
                     }
                  ]
               }
            ]
         }
      ]
   }
}

Whereever there is a folder, it should create a new <ul> with class folder with name inside <a> tag and if there is any children with type file, it should create a new <li> with name inside <a> and so on.

<ul class="folder">
   <li>
      <a>Parent</a>
      <ul class="folder">
         <li>
            <a>Folder 1</a>
            <ul class="folder">
               <li>
                  <a>File 1</a>
               </li>
               <li>
                  <a>File 2</a>
               </li>
               <li>
                  <a>File 2</a>
               </li>
            </ul>
         </li>
         <li>
            <a>Folder 2</a>
         </li>
         <li>
            <a>Folder 3</a>
            <ul class="folder">
               <li>
                  <a>Folder3 File1</a>
               </li>
               <li>
                  <a>Folder3 Folder1</a>
                  <ul class="folder">
                     <li>
                        <a>Folder3 Folder1 Folder1</a>
                        <ul class="folder">
                           <li>
                              <a>Folder3 Folder1 Folder1 File1</a>
                           </li>
                           <li>
                              <a>Folder3 Folder1 Folder1 File2</a>
                           </li>
                        </ul>
                     </li>
                  </ul>
               </li>
            </ul>
         </li>
      </ul>
   </li>
</ul>

I'm having a function already which is looping even for no children,

private function menuBuilder($menu_array, $is_sub = false)
{
    $attr = (!$is_sub) ? ' id="menu"' : ' class="submenu"';
    $menu = "<ul$attr>";

    $sub = '';
    foreach ($menu_array as $child) {
        foreach ($child as $key => $val) {
            if (is_array($val)) {
                $sub = $this->menuBuilder($val, true);
            } else {
                $sub = null;
                $$key = $val;
            }
        }

        $menu .= "<li><a>".$child['name']."</a>$sub</li>";
        unset($url, $display, $sub);

    }
    return $menu . "</ul>";
}

Please help optimizing this.

Answer 1

Here is what I have used finally,

function menuBuilder($menu_array, $is_sub = false)
{
    if(!$is_sub) {
        $menu = '<ul id="side-menu" class="nav"><li class="top-li"></li>';
    } else {
        $menu = '<ul class="nav side-submenu">';
    }

    $sub = '';
    foreach ($menu_array as $child) {
        foreach ($child as $key => $val) {
            if (is_array($val)) {
                $sub = menuBuilder($val, true);
            } else {
                $sub = null;
                $$key = $val;
            }
        }

        $menu .= "<li>".((trim($child['name'])!=null)?("<a>".$child['name']."</a>"):"")."$sub</li>";
        unset($url, $display, $sub);

    }
    return $menu . "</ul>";
}

$array = json_decode($json, true);
echo $list =  menuBuilder($array['data']['parentNode']['children']);