Jump to content

Divs nesting in foreach loop when they shouldn't


AdRock

Recommended Posts

I have problem with my code.

 

What i'm trying to do is loop through a 2d array first looking at the level so i should have 8 <div class="group">.  I then need to loop through the inner part of the array and i need to create groups of 4 so i should start with <div class="slide"> and close it after 4 items and if there are more repeat this process.

 

The problem lies with this part.  If i take it out it works but i need to get this in like shown below in my example output

 

Problem code

<?php if ($count % NUMCOLS == 0) echo '<div class="slide">';  # new row ?>

<?php echo $count; ?>

<?php $count++; ?>

<?php if ($count % NUMCOLS == 0) echo '</div>';  # new row ?>

Full code

<?php define ("NUMCOLS",4); ?>
<?php foreach ($this->level as $level => $courses): ?>    
<?php $count = 0; ?>
<div class="group" id="level<?=$level;?>">
    <div class="controls"><button class=prev>Previous</button> <button class=next>Next</button></div>
    <div class="pics" data-fx="scrollLeft" data-speed=300>
    <?php foreach ($courses as $course => $records): ?>
    <?php foreach ($records as $record): ?>
    
    <?php if ($count % NUMCOLS == 0) echo '<div class="slide">';  # new row ?>
    
    <?php echo $count; ?>
    
    <?php $count++; ?>
    
    <?php if ($count % NUMCOLS == 0) echo '</div>';  # new row ?>

    <?php endforeach; ?>
    <?php endforeach; ?>
    </div>
</div>
<?php endforeach; ?>

Actual output

<div class="group" id="level1">
    <div class="controls"><button class=prev>Previous</button> <button class=next>Next</button></div>
    <div class="pics" data-fx="scrollLeft" data-speed=300>
        <div class="group" id="level2">
            <div class="controls"><button class=prev>Previous</button> <button class=next>Next</button></div>
            <div class="pics" data-fx="scrollLeft" data-speed=300>
                <div class="slide">
                
                </div>
                <div class="slide">
                
                </div>
            </div>
        </div>
    </div>
</div>

desired output

<div class="group" id="level1">
    <div class="controls"><button class=prev>Previous</button> <button class=next>Next</button></div>
    <div class="pics" data-fx="scrollLeft" data-speed=300>
        <div class="slide">
        
        </div>
        <div class="slide">
        
        </div>
    </div>
</div>

<div class="group" id="level2">
    <div class="controls"><button class=prev>Previous</button> <button class=next>Next</button></div>
    <div class="pics" data-fx="scrollLeft" data-speed=300>
        <div class="slide">
        
        </div>
        <div class="slide">
        
        </div>
    </div>
</div>

This:

if ($count % NUMCOLS == 0) {

will only be TRUE if $count is 0, or $count is 4.

 

In your "desired HTML" example, you only show two iterations; therefore you'll never close the slide-classed DIV.

 

You should probably get a count of $courses and compare $count to count($courses).

It's hard to help without understanding how the array is structured. Here's my shot -

<?php

	define( 'NUMCOLS', 4 );
	
	foreach( $this->level as $level => $courses)
	{  
		$count = 0;
		$total_courses = count( $courses );
?>
		<div class="group" id="level<?=$level;?>">
    		<div class="controls"><button class="prev">Previous</button><button class="next">Next</button></div>
    		<div class="pics" data-fx="scrollLeft" data-speed="300">
<?php 
		foreach( $courses as $course => $records )
		{
			foreach( $records as $record )
			{
    			        if( $count <= $total_courses )
			        { 
					echo '<div class="slide">';  # new row
				}
					
				echo $count;
				
				if( $count <= $total_courses )
				{
					echo '</div>';  # new row
				}
				
				$count++;
			}
		}
?>
			</div>
		</div>
<?php
	} #END FOREACH
?>

I hope that helps.

 

p.s. you don't need to open and close PHP tags on every line

So, you open three (3) <div>'s in the first foreach, and close two (2) </div>'s after the inner foreach's finish.  I'm willing to bet, if you throw another </div> before the ending endforeach; that it will work like you want it to.

 

 

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.