How to echo these foreach arrays properly? - php

Question

Working on a project, am pretty new to PHP and don't know how to do this in a better way.
$item_thumbnails = array(
"https://brkcdn.com/v2/images/shop/thumbnails/f7dd8e95-551f-5e1f-92f1-2ea6c29e61ca.png",
"https://brkcdn.com/v2/images/shop/thumbnails/9fd1ea9d-cfd0-525a-963f-0c3438c5dc34.png"
);
$item_names = array(
"brick-luke's Fedora",
"Golden Bok"
);
$item_urls = array(
"https://www.brick-hill.com/shop/20/",
"https://www.brick-hill.com/shop/10267/"
);
$item_values = array(
"30.000",
"100.000"
);
$item_demands = array(
"High",
"Low"
);
foreach ($item_urls as $key => $item_url) {
foreach ($item_thumbnails as $key => $item_thumbnail) {}
foreach ($item_names as $key => $item_name) {}
foreach ($item_values as $key => $item_value) {}
foreach ($item_demands as $key => $item_demand) {}
echo ('
<div class="card">
<a class="image" href="'.$item_url.'">
<img src="'.$item_thumbnail.'" onerror="this.onerror=null;this.src="'.$storageUrl.'/error.png"">
</a>
<div class="content">
<a class="header">'.$item_name.'</a>
<div class="ui divider"></div>
Value: <div class="ui right floated red horizontal label">'.$item_value.'</div>
<div class="ui divider"></div>
Demand: <div class="ui right floated green horizontal label">'.$item_demand.'</div>
</div>
</div>
');
}
It only shows the latest item in the array on all tabs (if there are more).
How to fix this? Help is appreciated.

Answer 1

Something like this should work:
$item_thumbnails = array(
"https://brkcdn.com/v2/images/shop/thumbnails/f7dd8e95-551f-5e1f-92f1-2ea6c29e61ca.png",
"https://brkcdn.com/v2/images/shop/thumbnails/9fd1ea9d-cfd0-525a-963f-0c3438c5dc34.png"
);
$item_names = array(
"brick-luke's Fedora",
"Golden Bok"
);
$item_urls = array(
"https://www.brick-hill.com/shop/20/",
"https://www.brick-hill.com/shop/10267/"
);
$item_values = array(
"30.000",
"100.000"
);
$item_demands = array(
"High",
"Low"
);
// iterate over one array and get values from
// other arrays under the same key `$key`
foreach ($item_urls as $key => $item_url) {
echo ('
<div class="card">
<a class="image" href="'.$item_url.'">
<img src="' . $item_thumbnails[$key] . '" onerror="this.onerror=null;this.src="'.$storageUrl.'/error.png"">
</a>
<div class="content">
<a class="header">' . $item_names[$key] . '</a>
<div class="ui divider"></div>
Value: <div class="ui right floated red horizontal label">' . $item_values[$key] . '</div>
<div class="ui divider"></div>
Demand: <div class="ui right floated green horizontal label">' . $item_demands[$key] . '</div>
</div>
</div>
');
}

Answer 2

First of all you should improve your array structure.
$items = array(
[
"thumbnail" => "https://brkcdn.com/v2/images/shop/thumbnails/f7dd8e95-551f-5e1f-92f1-2ea6c29e61ca.png"
"name" => "brick-luke's Fedora",
"url" => "https://www.brick-hill.com/shop/20/",
"value" => "30.000",
"demand" => "High"
],
[
"thumbnail" => "https://brkcdn.com/v2/images/shop/thumbnails/9fd1ea9d-cfd0-525a-963f-0c3438c5dc34.png",
"name" => "Golden Bok",
"url" => "https://www.brick-hill.com/shop/10267/",
"value" => "100.000",
"demand" => "Low"
]
);
After that you can foreach $items variable and take data from it. See below:
<?php
foreach ($items as $item) {
?>
<div class="card">
<a class="image" href="<?php echo $item['url']; ?>">
<img src="<?php echo $item['thumbnail']; ?>" onerror="this.onerror=null;this.src=<?php echo $storageUrl; ?>/error.png">
</a>
<div class="content">
<a class="header"><?php echo $item['name']; ?></a>
<div class="ui divider"></div>
Value: <div class="ui right floated red horizontal label"><?php echo $item['value']; ?></div>
<div class="ui divider"></div>
Demand: <div class="ui right floated green horizontal label"><?php echo $item['demand']; ?></div>
</div>
</div>
<?php
}
?>
Enjoy!