PHP looping array and make <ul> issue

Question

Out put from this php array as below:

$data[$parent][] = ['id'=>$id, 'pageName'=>$pageName];

[1] => Array
    (
      [0] => Array
          (
              [id] => 2
              [pageName] => #
          )

      [1] => Array
          (
              [id] => 8
              [pageName] => #
          )
    )

[2] => Array
    (
      [0] => Array
          (
              [id] => 3
              [pageName] => item-add-new
          )

      [1] => Array
          (
              [id] => 4
              [pageName] => item-view
          )
    )

[8] => Array
    (
      [0] => Array
          (
              [id] => 9
              [pageName] => purchase-add-new
          )

      [1] => Array
          (
              [id] => 10
              [pageName] => purchase-view
          )
    )

Looping this array, just I need to make a <ul> as below:

<ul>
  <li class='nav-item active'>
    <a href='#' class='nav-link'>Page Name</a>
    <ul class='submenu-inner'>
      <li><a href='#' class='nav-link'>Sup Page Name</a></li>                               
      <li><a href='#' class='nav-link'>Sup Page Name</a></li>                               
    </ul>
  </li>   

  <li class='nav-item'>
    <a href='#' class='nav-link'>Page Name</a>
    <ul class='submenu-inner'>
      <li><a href='#' class='nav-link'>Sup Page Name</a></li>                               
      <li><a href='#' class='nav-link'>Sup Page Name</a></li>                               
    </ul>
  </li> 
</ul>

My question is, When looping the array, I need to add css class [.active] to parent <li> to make it active. When adding this it needs to compare pageName from array and the variable of value of open page name.

Eg: $p = "item-add-new";

This is How I tried it, From this code I can get my <ul> but, I can't put .active css class to parent <li>.

foreach ($data[1] as $main) {
    $sel1 = $p == $main['pageName'] ? 'nav-item active' : 'nav-item'; 
    $menuHtml .=  "<li class='$sel1'>
                      <a href='#' class='nav-link'>Page Name</a>
                      <ul class='submenu-inner'>";
        foreach ($data[$main['id']] as $sub) {
            $menuHtml .=  "<li><a href='$sub[pageName]' class='nav-link'>Sup Page Name</a></li>";
        }        
    
        $menuHtml .= "  </ul>
                     </li>";
}

Hope somebody may guide me to right direction. Thank you.

Answer 1

You need to search the sub-items to see if they contain the matching pageName, not compare with $main['pageName'].

Replace

$sel1 = $p == $main['pageName'] ? 'nav-item active' : 'nav-item'; 

with

$sel1 = in_array($p, array_column($data[$main['id']], 'pageName')) ? 'nav-item active' : 'nav-item'; 

You could also use a foreach loop.

$sel1 = 'nav-item';
foreach ($data[$main['id']] as $sub) {
    if ($sub['pageName'] == $p) {
        $sel1 = 'nav-item active';
        break;
    }
}