Postingan lainnya
Menampilkan gambar default berdasarkan slot tersisa
Saya mau menampilkan gambar yang ada di tables images.
Tabel group images
| id | Name | Max places |
1 Static 3
2 Rotate 2
Tabel images
| id | group_id | url |
1 1 https://ima.ges.png
2 2 https://ima.ges.png
3 2 https://ima.ges.png
Saya mau menampilan gambar yg ada di tabel images. Di group images dengan id 1 punya max slot 3 saja utk gambar yang bisa diisi. Sedangkan di tabel images cuma ada 1 gambar yg masuk di group images 1.
Jadi yang tampil di template ketika dipanggil dengan foreach adalah 1 gambar saja.
Sampai disini berarti group image 1 masih punya 2 slot kosong utk gambar. Nah saya maunya slot kosong tersebut diisi dengan gambar yg sudah saya sediakan.
Jadi kesimpulannya, yang tampil tetap 3 gambar dikarenakan di groups images 1 slot nya ada 3.
1. images dari tabel images, yaitu https://ima.ges.png
2. images kosong diisi gambar default.
3. images kosong diisi gambar default.
Tolong bantuannya.
1 Jawaban:
Mungkin sebelum di tampilkan, bisa di check terlebih dahulu, apakah datanya sudah sesuai dengan kapasitas maksimalnya atau belum. kalau memang belum, di set defaultnya bisa pake looping:
<pre> $groups = array( array('id' => 1, 'max_places' => 3), array('id' => 12, 'max_places' => 2), ); $images = array( array('id' => 1, 'group_id' => 1, 'url' => 'google.com') );
foreach ($groups as $group) { $max = $group['max_places']; $groupId = $group['id']; $selectedImagesGroup = array_filter($images, function($image) use($groupId) { return $image['group_id'] == $groupId; });
$diff = $max - count($selectedImagesGroup);
for ($i = 0; $i < $diff; $i++) { $images[] = array( 'id' => uniqid(), 'group_id' => $groupId, 'url' => 'https://source.unsplash.com/random/200x200' ); } }
print_r(json_encode($images)); die();
// Result Example
[ { "id": 1, "group_id": 1, "url": "google.com" }, { "id": "5df1fead2a890", "group_id": 1, "url": "https://source.unsplash.com/random/200x200" }, { "id": "5df1fead2a91b", "group_id": 1, "url": "https://source.unsplash.com/random/200x200" }, { "id": "5df1fead2a98d", "group_id": 12, "url": "https://source.unsplash.com/random/200x200" }, { "id": "5df1fead2a9f4", "group_id": 12, "url": "https://source.unsplash.com/random/200x200" } ] </pre>