php foreach wrap every 2 divs - php

I need to wrap every 2 divs with another div for a project (a row) so it will look like:
<div class="row">
<div> Item </div>
<div> Item </div>
</div>
<div class="row">
<div> Item </div>
<div> Item </div>
</div>
I have tried a few solutions but they dont work since the items coming in are odd (9 items). Here is what I had:
<?php
$count = 0;
foreach ($contents as $content)
{
//var_dump($content);
$books = $content["tags"];
$book_image = $content['content_image'];
$book_desc = $content['content_social_description'];
++$count;
if($count == 1)
{
echo "<div class='et_pb_row'>";
}
foreach ($books as $book)
{
$book_name = $book['tag_name'];
$book_name_trim = str_replace(' ', '-', $book_name);
?>
<!-- Inside the Book Loop -->
<div class='et_pb_column et_pb_column_1_2 books' style="background: url('https://s3-us-west-2.amazonaws.com/crowdhubproverbs31/<?php echo $book_image ;?>');">
<h2><?php echo $book_name; ?></h2>
<p><?php echo $book_desc; ?></p>
<?php echo $count; ?>
</div>
<?php
}
if ($count == 2)
{
echo "</div>";
$count = 0;
}
}
?>
This works except the second to last row has 3 items even though it dispays the "count" as 2 when I echo it out so it should reset but doesnt. So its:
<div class="row">
<div> Item </div> "Count 1"
<div> Item </div> "Count 2"
</div>
<div class="row">
<div> Item </div> "Count 1"
<div> Item </div> "Count 2"
</div>
<div class="row">
<div> Item </div> "Count 1"
<div> Item </div> "Count 2"
<div> Item </div> "Count 2"
</div>
<div class="row">
<div> Item </div> "Count 1"
<div> Item </div> "Count 2"
</div>

You should open and close your <rows/> in the books loop, and add a late check for odd books:
<?php
$count = 0;
foreach ($contents as $content)
{
//var_dump($content);
$books = $content["tags"];
$book_image = $content['content_image'];
$book_desc = $content['content_social_description'];
foreach ($books as $book)
{
++$count;
if($count == 1)
{
echo "<div class='et_pb_row'>";
}
$book_name = $book['tag_name'];
$book_name_trim = str_replace(' ', '-', $book_name);
?>
<!-- Inside the Book Loop -->
<div class='et_pb_column et_pb_column_1_2 books' style="background: url('https://s3-us-west-2.amazonaws.com/crowdhubproverbs31/<?php echo $book_image ;?>');">
<h2><?php echo $book_name; ?></h2>
<p><?php echo $book_desc; ?></p>
<?php echo $count; ?>
</div>
<?php
if ($count == 2)
{
echo "</div>";
$count = 0;
}
}
}
if ($count > 0)
{
echo "</div>";
}
?>
Doing so, your $count variable will be incremented only when foreach($books AS $book) loop is run (thus you have at least one book to print)

You can take advantage of array_chunk :
//First make a generator to get all books
function allBooks($contents) {
foreach($contents as $content) {
foreach($content['tags'] as $book) {
yield $book; //Here you can yield whatever you want !
}
}
}
//Then create rows
$itemPerRow = 2;
$rows = array_chunk(iterator_to_array(allBooks($contents)), $itemPerRow, true);
//Display all
foreach($rows as $row) {
echo '<row>';
foreach($row as $book) {
//Display the book !
}
echo '</row>';
}

Related

Output foreach-item in <div>, but output every 2nd and 3rd item in wrapping div

I have an array with items: $array = ['item 1','item 2','item 3','item 4','item 5','item 6','item 7']
I am looking for the following HTML:
<div class="big">Item 1</div>
<div>
<div class="small">Item 2</div>
<div class="small">Item 3</div>
</div>
<div class="big">Item 4</div>
<div>
<div class="small">Item 5</div>
<div class="small">Item 6</div>
</div>
<div class="big">Item 7</div>
In text: Every 3rd item (including the first) have to have their own div, while the 2nd and 3rd items get a wrapping div.
I've come up with the following loop, but I'm pretty sure it's not going to work in the long run, since it'll probably end the loop with an opening div, since I keep on opening a new one after each BIG ITEM.
$i = 0;
foreach($array as $item) {
<?php
if($i % 3 == 0) {
if($i == 0) {?>
<div class="big">
Item <?= $i; ?>
</div>
<div>
<?php } else { ?>
</div>
<div class="big">
Item <?= $i; ?>
</div>
<div>
<?php } ?>
<?php } else { ?>
<div class="small">
small item
<?= $i; ?>
</div>
<?php } ?>
<?php
$i++;
}
I feel like I'm close, but it also feels wrong to start and close divs in $is where it doesn't belong. Maybe the only thing I'm missing is checking if $i equals the length of the array, and then don't open a new <div> after a big item?
You can use simple if-elseif-else construct to print the divs.
If the index of the current element % 3 is 0, it is a big div, else it is a small div.
If the index of the current element % 3 is greater than 0, it is a small div.
If it is 1, prepend an opening div tag.
If it is 2, append a closing div tag.
Snippet:
<?php
foreach ($array as $idx => $set) {
$mod = $idx % 3;
if($mod === 0){
echo "<div class='big'>$set</div>";
}elseif($mod === 1){
echo "<div><div class='small'>$set</div>";
}else{// if $mod is 2
echo "<div class='small'>$set</div></div>";
}
}
Online Demo
Alternatively, use array_chunk then pick out the first item with array_shift, then join the remaining.
<?php
$array = array_chunk(['item 1','item 2','item 3','item 4','item 5','item 6','item 7'], 3);
foreach ($array as $set) {
echo '<div class="big">'.array_shift($set).'</div>';
if (count($set)) echo '<div><div class="small">'.implode('</div><div class="small">', $set).'</div></div>';
}
?>
Result
<div class="big">item 1</div>
<div>
<div class="small">item 2</div>
<div class="small">item 3</div>
</div>
<div class="big">item 4</div>
<div>
<div class="small">item 5</div>
<div class="small">item 6</div>
</div>
<div class="big">item 7</div>
Example: https://3v4l.org/URB3D
Here you are my simple answer: I think you don't need to use additional counter in case that interpreter adds indexes to array:
$array = ['item 1','item 2','item 3','item 4','item 5','item 6','item 7'];
foreach($array as $key=>$da){
$a = $key % 3;
if($a === 0){
echo "<div class=\"big\">" . $da . "</div>\n";
}
else{
if($a === 1)
echo "<div>\n";
echo " <div class=\"small\">" . $da . "</div>\n";
if($a === 2)
echo "<div>\n";
}
}

Use PHP foreach loop to display data in many html div tags

I have the following data and would like to display it in different containers in html.
Name Price Difference Signal
CA.PA 15.85 3.5609257364073 MACD
AZN.ST 896 3.4881049471963 MACD
AMGN 258.57 1.6391533819031 SMA 50/200
The containers are winner_1. As of right now the first winner_1 display the last Name from the above table.
How can I get it to say CA.PA in the first winner_1, and AZN.ST in the second winner_1, and AMGN in the last winner_1.
<div class="overview">
<h1>Winners</h1>
<div class="winner">
<?php
foreach ($res_winners_weekly as $r){
$name = $r["Name"];
$Price = $r['Price'];
$percent_diff = $r['Difference'];
$signal = $r['Signal'];
}
?>
<div class="winner_1">
<?php echo $name; ?>
</div>
<div class="winner_1">
<?php echo $name +1; ?>
</div>
<div class="winner_1">
</div>
</div>
</div>
The page can be seen here:
https://signal-invest.com/markets-today/
One option is generated div tags using php:
<div class="overview">
<h1>Winners</h1>
<div class="winner">
<?php
foreach ($res_winners_weekly as $r) {
$name = $r["Name"];
$Price = $r['Price'];
$percent_diff = $r['Difference'];
$signal = $r['Signal'];
echo "<div class='winner_1'>";
echo "<a href='#'>{$name}</a>";
echo "</div>";
}
?>
</div>
</div>
You should see following logic and try doing this way. Hopefully your problem will be resolved.
<div class = "overview">
<h1>Winners</h1>
<div class = "winner">
<?php
foreach ($res_winners_weekly as $r) {
$name = $r["Name"];
$Price = $r['Price'];
$percent_diff = $r['Difference'];
$signal = $r['Signal'];
echo "<div class='winner_1'><a href='#'> $name </a></div>";
}
?>
</div>
</div>

create new row after every 3 column in loop

So what i want to do is want to create a new row after every 3 column printing in php with bootstrap column with foreach loop here is my code
<div class = "row">
<?php foreach($location_list as $location)
{
echo "<div class ='col-md-4'>
<hr> $location->address </hr>
<hr> $location->name </hr>
<hr> $location->pin </hr>
</div> ";
}
?>
</div>
The code to print row should be inside foreach loop in a specific condition. And the condition for printing row should be as:
<?php
foreach ($location_list as $key => $location) {
if ($key % 3 == 0) {
echo '<div class = "row">';
}
echo "<div class ='col-md-4'>
<hr> $location->address </hr>
<hr> $location->name </hr>
<hr> $location->pin </hr>
</div> ";
if ($key % 3 == 2) {
echo '</div>';
}
}
?>

Php foreach loop wrapped every 2items with a row

<div class="puffar">
<?php
//Set up the objects needed
$my_wp_query = new WP_Query();
$all_wp_pages = $my_wp_query->query(array('post_type' => 'page'));
//Get children
$children = ($post->post_parent) ? get_page_children($post->post_parent, $all_wp_pages) : get_page_children($post->ID, $all_wp_pages);
$i = 0;
//Build custom items
echo "<div class='row'>";
foreach ($children as $child) {
?>
<div class="col-sm-6">
<div class="puff">
<div class="puff-image-holder">
<?php echo get_the_post_thumbnail($child->ID, 'full'); ?>
</div>
<fieldset class="linedHeadline hlmedium">
<legend><?php echo get_the_title($child->ID); ?></legend>
</fieldset>
<?php echo get_field("puff_introtext", $child->ID); ?>
<?php
$values = get_field('puff_lanktext', $child->ID);
if (get_field("popup_eller_lank", $child->ID) == "popup") {
?>
<fieldset class="linedHeadline hlmedium">
<legend><a class="linktopage open-popup"
href="<?php echo get_page_link($child->ID); ?>"><?php echo get_field("puff_lanktext", $child->ID); ?> </a>
</legend>
</fieldset>
<?php
} elseif (get_field("popup_eller_lank", $child->ID) == "extern") {
?>
<fieldset class="linedHeadline hlmedium">
<legend><a class="linktopage"
href="<?php echo get_field("puff_lank", $child->ID); ?>"><?php echo get_field("puff_lanktext", $child->ID); ?> </a>
</legend>
<?php
$i++;
if ($i % 2 == 0) {
echo "</div><div class='row'>";
}
} else {
}
?>
</div>
</div>
<?php } ?>
</div>
</div>
I want every 2 items that's rendered out to be wrapped in a <div class="row">, however I can't figure it out. Can anyone help me?
So basically the row should wrap every 2 elements that is getting looped. I have been stuck on this forever... Hopefully anyone got better expertise than me hehe.
The div="row" should wrap the col-sm-6 and class="puff".
$i = 0;
foreach ($children as $child) {
$i++;
// your code goes here
if($i % 2 == 0) {
echo "</div><div class='row'>";
// reset the counter to 0
$i = 0 ;
}
}
use proper logic
if ($i % 2 == 0) {
echo "</div><div class='row'>";
}
$i++;
First check if its mod by 2 or not (Gives 0 value after MOD), then close div , open new.
Now increase counter . Because for the first time , i will be 0 , then you increment it and then you use logic. So in short counter shoul be incremented at the end only not in between before you do any operation/logic.
Updated
Use code as it is **: issue was you have i++ and your condition in 3rd else if which never executed. So took it outside All and just before foreach.
<div class="puffar">
<?php
//Set up the objects needed
$my_wp_query = new WP_Query();
$all_wp_pages = $my_wp_query->query(array('post_type' => 'page'));
//Get children
$children = ($post->post_parent) ? get_page_children($post->post_parent, $all_wp_pages) : get_page_children($post->ID, $all_wp_pages);
$i = 0;
//Build custom items
echo "<div class='row'>";
foreach ($children as $child) {
?>
<div class="col-sm-6">
<div class="puff">
<div class="puff-image-holder">
<?php echo get_the_post_thumbnail($child->ID, 'full'); ?>
</div>
<fieldset class="linedHeadline hlmedium">
<legend><?php echo get_the_title($child->ID); ?></legend>
</fieldset>
<?php echo get_field("puff_introtext", $child->ID); ?>
<?php
$values = get_field('puff_lanktext', $child->ID);
if (get_field("popup_eller_lank", $child->ID) == "popup") {
?>
<fieldset class="linedHeadline hlmedium">
<legend><a class="linktopage open-popup"
href="<?php echo get_page_link($child->ID); ?>"><?php echo get_field("puff_lanktext", $child->ID); ?> </a>
</legend>
</fieldset>
<?php
} elseif (get_field("popup_eller_lank", $child->ID) == "extern") {
?>
<fieldset class="linedHeadline hlmedium">
<legend><a class="linktopage"
href="<?php echo get_field("puff_lank", $child->ID); ?>"><?php echo get_field("puff_lanktext", $child->ID); ?> </a>
</legend>
<?php
} else {
}
?>
</div>
</div>
<?php
if ($i % 2 == 0) {
echo "</div><div class='row'>";
}
$i++;
} ?>
</div>
</div>
First set $i=0;
if ($i % 2 == 0) {
echo "</div><div class='row'>";
}
$i++;

Issuet with div's position - HTML PHP

I have a customer's list where is possible to tag each one like "Emprendedor", "Creativo" and/or "Detallista". I want to insert the following icon for no-taged customers:
http://imagizer.imageshack.us/v2/800x600q90/824/6h1d.png
The problem is the icon's position. I want it next to label. The code is:
<?php
foreach($customers as $customerKey => $customer){ ?>
<? $selectedCount = "0"; ?>
<div class="row customer customer-<?=$customer?>">
<div class="col-xs-6 col-md-4 customer-name customer-<?=$customer?>"><?=utf8_encode($customerNames[$customer])?></div>
<div class="col-xs-6 col-md-4"><?
foreach($tags as $tagKey => $tag){
$selected=false;
foreach($customerTags as $customerTagKey => $cTags)
if($customerTagKey == $customer)
foreach($cTags as $cKey => $cTag)
if($cTag == $tag){
$selected=true;
$selectedCount = $selectedCount + 1;
}
?><span class="label label-<?=$tag?><?=$selected?" selected":" hidden-print"?> customer-<?=$customer?>" onclick="connect('customer-<?=$customer?>', '<?=$customer?>', '<?=$tag?>');"><?=$tag?></span> <?
}?></div>
</div> <!-- customer-<?=$customer?> row -->
<?
echo "<div class=\"";
if($selectedCount == 0){
echo "glyphicon glyphicon-exclamation-sign glyphicon-red";
}
if($selectedCount > 1){
echo "glyphicon glyphicon-retweet glyphicon-blue";
}
echo " \"></div>";
}
?>

Categories