Building a html list of links with groups of sublists that are based on a common id

Question

What I have:

I have an array of links and their meta data.
Some links need to be grouped together and some are regular links.

What I'm trying to do:

I'm trying to iterate through my array and group li's with their relative ul, based on a common id.

The problem:

• One problem is only making unique ul's based on said id and not make a ul for each item it iterates through.
• The second more difficult problem is grouping each item within the relative ul.

Here is an example array I have to work with:

<?php
$array = array();

$array['page']['colours']['link'] = '/colours';
$array['page']['colours']['link-title'] = 'Colours';


$array['page']['colours']['subpage']['green']['aside']['link'] = '/colours/green';
$array['page']['colours']['subpage']['green']['aside']['link-title'] = 'Green';


$array['page']['colours']['subpage']['blue']['aside']['collapse']['id'] = 'cool-colours';
$array['page']['colours']['subpage']['blue']['aside']['link'] = '/colours/blue';
$array['page']['colours']['subpage']['blue']['aside']['link-title'] = 'Blue';

$array['page']['colours']['subpage']['purple']['aside']['collapse']['id'] = 'cool-colours';
$array['page']['colours']['subpage']['purple']['aside']['link'] = '/colours/purple';
$array['page']['colours']['subpage']['purple']['aside']['link-title'] = 'Purple';

$array['page']['colours']['subpage']['orange']['aside']['collapse']['id'] = 'bright-colours';
$array['page']['colours']['subpage']['orange']['aside']['link'] = '/colours/orange';
$array['page']['colours']['subpage']['orange']['aside']['link-title'] = 'Orange';

$array['page']['colours']['subpage']['yellow']['aside']['collapse']['id'] = 'bright-colours';
$array['page']['colours']['subpage']['yellow']['aside']['link'] = '/colours/yellow';
$array['page']['colours']['subpage']['yellow']['aside']['link-title'] = 'Yellow';

$array['page']['colours']['subpage']['red']['aside']['collapse']['id'] = 'bright-colours';
$array['page']['colours']['subpage']['red']['aside']['link'] = '/colours/red';
$array['page']['colours']['subpage']['red']['aside']['link-title'] = 'Red';


$array['page']['colours']['subpage']['pink']['aside']['collapse']['id'] = 'bright-colours';
$array['page']['colours']['subpage']['pink']['aside']['link'] = '/colours/pink';
$array['page']['colours']['subpage']['pink']['aside']['link-title'] = 'Pink';
?>

Here is what I have currently for iterating through this array:

<aside id="sidebar">
  <?php
    if ( !empty( $array ) ) { ?>
    <ul class="menu">

      <?php foreach ( $array['page']['colours']['subpage'] as $subpage ) {
        if( !empty( $subpage['aside'] ) ) {
          $historyArray = array();
        ?>
          <li>
            <?php if( !empty( $subpage['aside']['collapse'] ) ) { ?>

              <?php if( !in_array( $subpage['aside']['collapse']['id'], $historyArray ) ) { ?>

                <a data-toggle="collapse" data-parent="#sidebar" href="#<?php echo $subpage['aside']['collapse']['id'] ?>" class="<?php echo $currentPageLink === $subpage['aside']['link'] ? 'active' : '' ?>"><?php echo $subpage['aside']['link-title'] ?></a>

                <ul id="<?php echo $subpage['aside']['collapse']['id'] ?>">
                  <li>

                    <a href="<?php echo $subpage['aside']['link'] ?>" class="<?php echo $currentPageLink === $subpage['aside']['link'] ? 'active' : '' ?>"><?php echo $subpage['aside']['link-title'] ?></a>

                  </li>
                </ul>

              <?php
                $historyArray[] = $subpage['aside']['collapse']['id'];
                }
              ?>
            <?php } else { ?>
              <a href="<?php echo $subpage['aside']['link'] ?>" class="<?php echo $currentPageLink === $subpage['aside']['link'] ? 'active' : '' ?>"><?php echo $subpage['aside']['link-title'] ?></a>
            <?php } ?>
          </li>
      <?php } } ?>

    </ul>
  <?php } ?>
</aside>

Answer 1

Wow, now THAT'S a confusing array! But everything is doable, right? It's just a matter of what you're willing to try. :)

I think you need to create a new array that fits the listing purpose, then iterate through that for the list (The huge complex array will remain intact for whatever else it's used for). Consider this:

<?php
if ( !empty( $array ) ) {
    //Create the new array $uls[id][color]['link'/'link-title']
    foreach ( $array['page']['colours']['subpage'] as $color => $subpage ) {
        $uls[$subpage['aside']['collapse']['id']][$color]['link'] = $subpage['aside']['link'];
        $uls[$subpage['aside']['collapse']['id']][$color]['link-title'] = $subpage['aside']['link-title'];
    }
}
if ( !empty( $uls ) ) {
    echo '<aside id="sidebar">';
    echo '<ul class="menu">';
    //iterate through the new $uls array
    foreach($uls as $id => $color) {
        //for each id, we create a ul, then iterate through that id's array
        echo '<li><ul id="' . $id . '">';
        foreach($color as $link_array) {
            //echo the list item for each link in the id
            $active = ($currentPageLink === $link_array['link']) ? 'active' : '';
            echo '<li><a href="' . $link_array['link'] . '" class="' . $active  . '">' . $link_array['link-title'] . '</a></li>';
        }
        echo '</ul></li>';
    }
    echo '</ul>';
    echo '</aside>';
}
?>

One thing I didn't add was the data-collapse link. I wasn't sure exactly what you were going for there. That shouldn't be too hard to stick in there though.