Jump to content
joe_ma

for loop for page array doesn't work

Recommended Posts

Hello

I'd like to build an unordered list for a front page that looks like this:

<ul class="topCircles" role="navigation">
            <li class="circle"><a href="#texte">texte</a></li>
            <li class="circle"></li>
            <li class="circle"><a href="logos.html">logos</a></li>
            <li class="circle"><a href="plakate.html">plakate</a></li>
            <li class="circle"><a href="events.html#">events</a></li>
            <li class="circle"><a href="krimitage.html">krimitage</a></li>
            <li class="circle"><a href="fotografie.html">fotografie</a></li>
            <li class="circle"></li>
            <li class="circle"><a href="sonstiges.html">sonstiges</a></li>
            <li class="circle"></li>
            <li class="circle"></li>
            <li class="circle"></li>
            <li class="circle"></li>
            <li class="circle"><a href="ideen.html">ideen</a></li>
            <li class="circle"><a href="ueber.html">über</a></li>
            <li class="circle"><a href="mit.html">mit</a></li>
        </ul>

It's a 4×4 set of circles, some of them with links in it, some without. Redactors should be able to choose, at what position a certain page should be linked to.

So I put an integer field (front_position) into the template for these pages, where redactors indicate the desired position for the pages. I tried to achieve all of this with this code:

    $content .= '<main class="front">'; // Container for circles
    $content .= '<ul class="topCircles" role="navigation">';  // nav list 

    // Output of 16 li elements with links at the chosen postions

    $items = $page->children; // Array of pages
    
    $item = reset($items); // set the first element of the array

    // loop for 16 elements; put a link in it where front_position == $index
      
    for ($index = 1; $index <= 16; ++$index) { 
        $content .= '<li class="circle">';
        if ($item->front_position == $index) {
            $content .= '<a href="' . $item->url . '">' . $item->title . '</a>';
            $item = next($items);
        }
    $content .= '</li>';

    }  
            
    $content .= '</ul> 
                </main>'; // Ende Liste und Container

This doesn't work though. I only get 16 empty li elements.

Thanks for help.

Share this post


Link to post
Share on other sites

@joe_ma not sure if it's the issue but seems to me you're using a PHP array functions on a ProcessWire PageArray object - different beasts

1 hour ago, joe_ma said:

$items = $page->children; // Array of pages

Is not a PHP array. It is a ProcessWire PageArray.

Share this post


Link to post
Share on other sites

Oops. So how can I achieve this List ?

Share this post


Link to post
Share on other sites

@joe_ma

Maybe something like (untested):

<?php

$content .= '<main class="front">'; // Container for circles
$content .= '<ul class="topCircles" role="navigation">';  // nav list 

// Output of 16 li elements with links at the chosen postions
$items = $page->children("limit=16, sort=sort"); // PageArray limited to 16 items. Sorted according to template/page children settings

foreach ($items as $item) {
    if ($item->front_position == $item->index() {
      $content .= '<a href="' . $item->url . '">' . $item->title . '</a>';
    }
    $content .= '</li>';
}  
            
$content .= '</ul> 
</main>'; // Ende Liste und Container

From the PW API Docs: https://processwire.com/api/ref/page/index/

 

Share this post


Link to post
Share on other sites

That doesn't do the trick either. Since there are less than 16 pages in $items this produces only – in this case – 10 li elements. And they are without links. 

Share this post


Link to post
Share on other sites
1 hour ago, psy said:

@joe_ma

Maybe something like (untested):


<?php

$content .= '<main class="front">'; // Container for circles
$content .= '<ul class="topCircles" role="navigation">';  // nav list 

// Output of 16 li elements with links at the chosen postions
$items = $page->children("limit=16, sort=sort"); // PageArray limited to 16 items. Sorted according to template/page children settings

foreach ($items as $item) {
    if ($item->front_position == $item->index() {
      $content .= '<a href="' . $item->url . '">' . $item->title . '</a>';
    }
    $content .= '</li>';
}  
            
$content .= '</ul> 
</main>'; // Ende Liste und Container

From the PW API Docs: https://processwire.com/api/ref/page/index/

 

Aren't there missing the opening <li> tags?
It should be

foreach ($items as $item) {
	$content .= '<li>';
	if ($item->front_position == $item->index() {
		$content .= '<a href="' . $item->url . '">' . $item->title . '</a>';
	}
	$content .= '</li>';
}


 

Share this post


Link to post
Share on other sites

I thought that maybe using the WireArray::Explode function to create an array first and then loop through this array could work. The code looks like this:

$content .= '<main class="front">'; // begin list container 
$content .= '<ul class="topCircles" role="navigation">';  // begin list for nav 

    $items = $page->children('sort=front_position'); // page array

    $links = $items->explode(function($item) { // turn into a php array
        return array(
            'pos' => $item->front_position, 
            'url' => $item->url, 
            'title' => $item->title
        ); 
    }); 

    $link = reset($links);

        for ($index = 1; $index <= 16; ++$index) { 
        $content .= '<li class="circle">';
        if ($link['pos'] == $index) {
            $content .= '<a href="' . $link['url'] . '">' . $link['title'] . '</a>';
            $link = next($link);
        }
    $content .= '</li>';

        }

    $content .= '</ul>  
                </main>'; // end nav and list container

This produces a list, but only with one link (the first one with "Text") and 15 empty li elements. $links does contain all the elements though, as shows print_r($links):

Array
(
    [0] => Array
        (
            [pos] => 1
            [url] => /rederei/text/
            [title] => Text
        )

    [1] => Array
        (
            [pos] => 3
            [url] => /rederei/logos/
            [title] => Logos
        )

    [2] => Array
        (
            [pos] => 4
            [url] => /rederei/plakate/
            [title] => Plakate
        )

    [3] => Array
        (
            [pos] => 5
            [url] => /rederei/events/
            [title] => Events
        )

    [4] => Array
        (
            [pos] => 6
            [url] => /rederei/krimitage/
            [title] => Krimitage
        )

    [5] => Array
        (
            [pos] => 7
            [url] => /rederei/fotografie/
            [title] => Fotografie
        )

    [6] => Array
        (
            [pos] => 9
            [url] => /rederei/sonstiges/
            [title] => Sonstiges
        )

    [7] => Array
        (
            [pos] => 14
            [url] => /rederei/ideen/
            [title] => Ideen
        )

    [8] => Array
        (
            [pos] => 15
            [url] => /rederei/ueber/
            [title] => Über
        )

    [9] => Array
        (
            [pos] => 16
            [url] => /rederei/mit/
            [title] => Mit
        )

)

Still don't know what's wrong with the loop.

Share this post


Link to post
Share on other sites
35 minutes ago, joe_ma said:

$link = next($link);

Should be $link = next($links);

Share this post


Link to post
Share on other sites

Heureka!

Thanks so much, ottogal.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.

×
×
  • Create New...