Bài toán chia đều column, html bằng php Full (ok)

https://stackoverflow.com/questions/59245560/how-to-make-a-nested-for-loop-split-output-across-two-divs

Đọc bài viết này dùng cho vòng lặp wordpress khá hay

PHP Loop - Add a Div around every three Items

Đã áp dụng

<div class="row">
    <?php 
    $i = 1;
    $wp_query = new WP_Query(array('posts_per_page' => -1, 'post_type' => 'projects'));
    echo '<div class="panel">';
    if($wp_query->have_posts()) : while ($wp_query->have_posts()) :
         $wp_query->the_post();

         the_title();         
         if($i % 3 == 0 && $wp_query->post_count != $i){
             echo '</div><div class="panel">';
         }
         $i++; 
     endwhile; endif;
     echo '</div>';    
  ?>

</div>

Ví dụ 1:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <?php
function pc_grid_horizontal($array, $size) {
  // compute <td> width %ages
  $table_width = 100;
  $width       = intval($table_width / $size);
  // define how our <tr> and <td> tags appear
  // sprintf() requires us to use %% to get literal %
  $tr = '<div class="tr">';
  $td = "<div class='td' style=\"width:$width%%\">%s</div>";
  // open table
  $grid = "<div class='table'><div class='tbody'>$tr";
  // loop through entries and display in rows of size $sized
  // $i keeps track of when we need a new table tow
  $i = 0;
  foreach ($array as $e) {
    $grid .= sprintf($td, $e);
    $i++;
    // end of a row
    // close it up and open a new one
    if (!($i % $size)) {
      $grid .= "</div>$tr";
    }
  }
  // pad out remaining cells with blanks
  while ($i % $size) {
    $grid .= sprintf($td, '&nbsp;');
    $i++;
  }
  // add </div>, if necessary
  $end_tr_len = strlen($tr) * -1;
  if (substr($grid, $end_tr_len) != $tr) {
    $grid .= '</div>';
  } else {
    $grid = substr($grid, 0, $end_tr_len);
  }
  // close table
  $grid .= '</div></div>';
  return $grid;
}
echo pc_grid_horizontal(["aaaa1", "aaaa2", "aaaa3", "aaaa4"], 3);
?>
  <style type="text/css">
    .table {
      width: 500px;
      border: 1px solid #000;
      display: block;
      margin: 50px auto;
    }
    .tbody {
      width: 100%;
      display: block;
    }
    .tr {
     display: flex;
     padding: 2px;
    }
    .td {
      width: 33%;
    border: 1px solid red;
    padding: 15px;
    }
  </style>
</body>
</html>

Ví dụ 2:

$array=['a','b','c','d','e','f','g'];
$chunckedArray=array_chunk($array,3);
//output: $chunkedArray=[['a','b','c'],['d','e','f'],['g']]

Ví dụ 3:

<?php
$arr = array(1, 2, 3, 4, 5, 6, 7, 8, 9);
$count = sizeof($arr);
$cols  = 4;
for ($i = 0; $i < $count; $i++) {
  if ($i % $cols == 0) {
  	echo '<div class="aaa">';
  }
  echo '<div>inner div</div>';
  if (($i % $cols == $cols - 1) || ($i == $count - 1)) {
    echo '</div>';
  }
}
?>

Ví dụ 3.1

<?php $arr = array(1, 2, 3, 4, 5, 6, 7, 8);
$length    = count($arr);
?>
<div class="row w-100"> 
  <?php for ($i = 1; $i <= 2; $i++) { ?>
	<div class="row w-100"> 
	<?php
		for ($j = 0; $j <= $length; $j++) {
	    if ($j == 8) {
	      break;
	    } else {
	      echo $arr[$j];
	    }
	  }
	?>
	</div>
	<?php } ?>
</div>

Ví dụ 3.2

<?php
$arr    = array(1, 2, 3, 4, 5, 6, 7, 8);
$length = count($arr);
$group  = array();
$count  = 0;
$div    = 2;
foreach ($arr as $i) {
  $group[] = $i;
  $count++;
  if ($count % $div == 0) {
    echo "<div>" . implode('', $group) . "</div>";
    $group = array();
    $count = 0;
  }
}
?>

Last updated