1

enter image description here

how do i achieve the above result with for / foreach loop [Picture 2]? ive googled around but could not find the answer what i want...

$name = array('D1','D2','D3' );

foreach ( $name as $k=> $v ) {
  $openTime3 = strtotime('10:00');
  $closeTime3 =  strtotime('15:00');

  echo '<div class="col"> <span class="header">'.$v.'</span>';

  while ( $openTime3 < $closeTime3 ) {
     if ( ( date('Hi', $openTime3) > '1030'  && date('Hi', $openTime3) < '1130' ) && $k == 1) {
        echo '<span class="body "><a href="#" class="unconfirmed">B</a></span>';
        break; /* ???? */
        // try to use continue or break, and it didnt work i above result.
     } else {
        echo '<span class="body"><a href="#" class="available">AV</a></span>';
     }

     $openTime3 = strtotime('+15 minutes', $openTime3);
  }

  echo '</div>';
}

css code:

.col { text-align: center; width: auto; float: left; }
.col > span { display: block; }
.col > span > a {height: 26px;line-height: 26px;display: block; padding: 0 10px; }
.col > span > .available { background: #D6F2F4; }

above code always return below result [Picture 1]:

enter image description here

9
  • 2
    Can you please put this in a fiddle(with css) so that we can make changes to it? Commented Nov 26, 2012 at 18:55
  • 2
    Have you considered using an actual table? With rowspan? Commented Nov 26, 2012 at 18:56
  • If you want to break your outer loop while in the scope of your inner loop, use break 2 Commented Nov 26, 2012 at 18:57
  • @MadaraUchiha how do i archive that result with table rowspan? Commented Nov 26, 2012 at 19:01
  • @Grey i used break 2, but it break the next loop. Commented Nov 26, 2012 at 19:03

2 Answers 2

1

I added unconfirmed style to your css with border color same as background. Use flag to toggle B

<style>
.col { text-align: center; width: auto; float: left; }
.col > span { display: block; }
.col > span > a {height: 26px;line-height: 26px;display: block; padding: 0 10px; }
.col > span > .available { background: #D6F2F4;border-style:solid;
border-width:1px;}
.col > span > .unconfirmed { background: #ffff99;border-style:solid;
border-width:1px;border-color: #ffff99;}

</style>
<?php
$name = array('D1','D2','D3' );
$flag=0;//Set flag off
foreach ( $name as $k=> $v ) {
  $openTime3 = strtotime('10:00');
  $closeTime3 =  strtotime('15:00');

  echo '<div class="col"> <span class="header">'.$v.'</span>';

  while ( $openTime3 < $closeTime3 ) {

     if ( ( date('Hi', $openTime3) > '1030'  && date('Hi', $openTime3) < '1130' ) && $k == 1) {

        if($flag==0){
        echo '<span class="body "><a href="#" class="unconfirmed"></a></span>';//Hide B
        $flag=1;Toggle flag on
        }else{
        echo '<span class="body "><a href="#" class="unconfirmed">B</a></span>';Show B
        $flag=0;Toggle flag off
        }

     } else {
        echo '<span class="body"><a href="#" class="available">AV</a></span>';
     }
     //$flag=1;
     $openTime3 = strtotime('+15 minutes', $openTime3);
  }
  echo '</div>';
}
?>

enter image description here

Sign up to request clarification or add additional context in comments.

1 Comment

thanks.. it gives me some idea. But the yellow slot.. it could be more than 15, 30, 45, 60 minutes, etc
1

if you use the break it will stop processing at the 10:45 and not print anything for 11 - 11:30.

D Time Result
0 14:45 AV
1 10:00 AV
1 10:15 AV
1 10:30 AV
1 10:45 B  <= Breaks Here
2 10:00 AV

Using continue instead of break you will need to ensure that, the time is adjusted prior to issuing the continue or you'll get a fatal error never ending loop.

while ( $openTime3 < $closeTime3 ) {
 if ( ( date('Hi', $openTime3) > '1030'  && date('Hi', $openTime3) < '1130' ) && $k == 1) {
    echo '<span class="body "><a href="#" class="unconfirmed">B</a></span>';
    $openTime3 = strtotime('+15 minutes', $openTime3);
    continue;
 } else {
    echo '<span class="body"><a href="#" class="available">AV</a></span>';
 }

   $openTime3 = strtotime('+15 minutes', $openTime3);
}

But this will not produce the results you want either as it will be 3 seperate B blocks instead of 1 B block that is increased in height;

1 1000 AV
1 1015 AV
1 1030 AV
1 1045 B
1 1100 B
1 1115 B
1 1130 AV
1 1145 AV
etc..

If you do want a single span element for the b block you'll need to calculate the number you need and adjust the height accordingly in css depending on the number needed

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.