Display multiple images using laravel datatables - ajax

Question

I want to know how to display multiple images that is stored in the database as an array : ["img1.jpeg","img2.png"]
Here is my controller.
In my case only one image is displayed in the datatable.
if ($request->ajax()) {
$data = Actualite::latest()->get();
return Datatables::of($data)
->addIndexColumn()
->editColumn('created_at', function ($data) {
return $data->created_at->format('Y-m-d'); // human readable format
})
->addColumn('image', function ($data) {
$images = json_decode($data->image);
if ((is_array($images) || is_object($images))) {
$imgs="";
foreach ($images as $image ) {
$url= asset('storage/actualite/'.$image);
$imgs = '<img src="'.$url.'" width="30" class="img-fluid rounded-circle" alt="" />' ;
}
}
return $imgs;
})
->addColumn('action', function ($data) {
$btns ='<div class="btn-group">
<button type="button" class="btn btn-dark btn-sm">Action</button>
<button type="button" class="btn btn-dark btn-sm dropdown-toggle dropdown-toggle-split" id="dropdownMenuReference1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" data-reference="parent">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-down"><polyline points="6 9 12 15 18 9"></polyline></svg>
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuReference1">
<a class="dropdown-item" href="actualités/edit/'.$data->id.'" class="edit">Edit</a>
<a class="dropdown-item" onclick="return confirm(`Êtes-vous sûr de supprimer cet enregistrement ?`)" href="actualités/destroy/'.$data->id.'">Delete</a>
</div>
</div>';
return $btns;
})
->rawColumns(['image','action'])
->make(true);
}

Answer 1

i assume you are only getting only last image as output as this is not an array variable
$imgs="";