counter in while loop

+1 jamie y · December 25, 2014
I have a while loop that runs six times. I created a counter to add to a classname. This is how it is suppose to look.

box1

box2

box3

box2

box1

right now, with my while loop, it counts like so

box1

box2

box3

box2

box3

box2

So I did a check to get that second result

if $counter >= 3; $counter--

Is there anyway to get it to count to 3 in the while loop and then reverse count back to 1?

Post a Reply

Replies

Oldest  Newest  Rating
+2 Chris Sisco · December 25, 2014
I wrote a while loop up real quick to produce the result you want. Not sure if this will help you or not though.

You can check results here:
http://sandbox.onlinephpfunctions.com/code/b1cf3f98e6c2d4517ecde20eb20d1b53df1bd693


$done = false;
$counter = 0;
$reverse = false;
while ( !$done ) {

  if ( $counter >= 3 || $reverse == true ) {
    $counter--;

    if ( $counter == 0 ) {
      $done = true;
    } else {
      echo "box".$counter."\n";
    }

  }

  if ( $counter < 3 && $reverse == false ) {
    $counter++;

    if ( $counter == 3 ) {
      $reverse = true;
    }

    echo "box".$counter."\n";
  }
}


Result:

box1
box2
box3
box2
box1
+1 jamie y · December 27, 2014
YEP! That did it. Thank you so much Chris Sisco. I needed that counter to add css to wordpress posts. This way, it doesn't matter how many posts there are, the css gets applied.
0 jamie y · December 26, 2014
I see that your code does work. I haven't been able to get it to work in my structure though. For a better idea, here is the actual code that I am working on



    $counter = 1;
                    if( $about->have_posts()) :
                ?>
                    <div class="list_carousel2 responsive  animated" data-animation="bounceInUp" data-animation-delay="150">
                        <ul id="foo2">
                            
                            <?php while ( $about->have_posts()) : $about->the_post(); ?>
                               <li>
                                <div class="box<?php echo $counter; if( $about->current_post >= 2 ) { $counter--; } elseif ( $counter < 1 ) { $counter = $counter + 1; } else { $counter++; }  ?>">
                                <?php $str = get_the_title();
                                      $title = explode( " ", $str );
                                ?>
                                    <p class="title"><?php echo the_title(); ?>
                                    
                                </div><!--END box -->
                                
                                <?php
                                    if( has_post_thumbnail()){
                                        ?><figure><?php
                                            the_post_thumbnail();
                                        ?></figure>
                              <?php } ?>
                            </li>
                            <?php endwhile; endif; ?>


I am working in WordPress. Right now, the above code does give me



<div class="box1"></div>
<div class="box2"></div>
<div class="box3"></div>
<div class="box2"></div>
<div class="box1"></div>
<div class="box0"></div>

It's the last one there. I get box0. I need that to go back to 1
0 Chris Sisco · December 26, 2014
It looks like your elseif ( $counter <1 ) is doing the same thing for either outcome. Is this what you wanted to do?

...

elseif ( $counter < 1 ) { $counter = $counter + 1; } else { $counter++; } 

...

If there are a total of 10 posts do you want to get this result?

<div class="box1"></div>
<div class="box2"></div>
<div class="box3"></div>
<div class="box2"></div>
<div class="box1"></div>
<div class="box2"></div>
<div class="box3"></div>
<div class="box2"></div>
<div class="box1"></div>
<div class="box2"></div>
0 jamie y · December 26, 2014
Yes, that is the result that I am going for. I have only three spots for a post to sit. So the class="box1" applies css rules to each container. Right now, my last post ends up being class="box0"
0 Chris Sisco · December 27, 2014
OK I think I've got it now.
http://sandbox.onlinephpfunctions.com/code/f2210b62a4994e3b1f94f4de6cb6a60892da854a

This is the sandbox code:

$counter = 0;
$reverse = false;

$posts = [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20];

foreach($posts as $p){

  $divStart = '<div class="box';
  echo $divStart;

  //This is the line that does what you want
  if ( $counter >= 3 || $reverse == true ) { $counter--; if ( $counter == 0 ) { $counter = 1; $reverse = false; } else { echo $counter; } } if ( $counter < 3 && $reverse == false ) { $counter++; if ( $counter == 3 ) { $reverse = true; } echo $counter; }

  $divEnd = '">This is post number '.$p.'</div>'."\n";
  echo $divEnd;
}


And the result:

<div class="box1">This is post number 1</div>
<div class="box2">This is post number 2</div>
<div class="box3">This is post number 3</div>
<div class="box2">This is post number 4</div>
<div class="box1">This is post number 5</div>
<div class="box2">This is post number 6</div>
<div class="box3">This is post number 7</div>
<div class="box2">This is post number 8</div>
<div class="box1">This is post number 9</div>
<div class="box2">This is post number 10</div>
<div class="box3">This is post number 11</div>
<div class="box2">This is post number 12</div>
<div class="box1">This is post number 13</div>
<div class="box2">This is post number 14</div>
<div class="box3">This is post number 15</div>
<div class="box2">This is post number 16</div>
<div class="box1">This is post number 17</div>
<div class="box2">This is post number 18</div>
<div class="box3">This is post number 19</div>
<div class="box2">This is post number 20</div>


This is how it would look in your code sample:

$counter = 0; //I changed this to 0
$reverse = false; //And added this variable

if( $about->have_posts()) :
?>
<div class="list_carousel2 responsive animated" data-animation="bounceInUp" data-animation-delay="150">
<ul id="foo2">

<?php while ( $about->have_posts()) : $about->the_post(); ?>
<li>
<div class="box<?php if ( $counter >= 3 || $reverse == true ) { $counter--; if ( $counter == 0 ) { $counter = 1; $reverse = false; } else { echo $counter; } } if ( $counter < 3 && $reverse == false ) { $counter++; if ( $counter == 3 ) { $reverse = true; } echo $counter; } ?>">
<?php $str = get_the_title();
$title = explode( " ", $str );
?>
<p class="title"><?php echo the_title(); ?>

</div><!--END box -->

<?php
if( has_post_thumbnail()){
?><figure><?php
the_post_thumbnail();
?></figure>
<?php } ?>
</li>
<?php endwhile; endif; ?>

Hopefully that will get the results you need! :)
0 Chris Sisco · December 27, 2014
Glad to see that it worked!
  • 1

PHP

106,971 followers
About

Server-side, HTML embedded scripting language used to create dynamic Web pages.

Links
Moderators