Display array format image from database in laravel

Question

I was trying to create one database to store images. It stores the URL of that image and the insertion is working fine.But it saves in array format as ["light.jpg"]. Now I want to display the image stored in the database but it just shows image icon and not display the image. The image is stored in the image folder inside the public folder.

Below I attach my code:

Form Controller:

public function store(Request $request)
{

    $this->validate($request, [
            'filename' => 'required',
            'filename.*' => 'image|mimes:jpeg,png,jpg,gif,svg|max:2048'
    ]);

    if($request->hasfile('filename'))
    {
        foreach($request->file('filename') as $image)
        {
            $name=$image->getClientOriginalName();
            $image->move(public_path().'/images/', $name);  
            $data[] = $name;  
        }
     }

     $form= new Form();
     $form->filename=json_encode($data);
     $form->save();
     return back()->with('success', 'Your images has been successfully');
 }
 public function show()
 {
    $users = DB::select('select * from forms');
    return view('display',['users'=>$users]);
 }

Insert page

<form method="post" action="{{url('form')}}" enctype="multipart/form-data">
  {{csrf_field()}}

        <div class="input-group control-group increment" >
          <input type="file" name="filename[]" class="form-control">
          <div class="input-group-btn"> 
            <button class="btn btn-success" type="button"><i class="glyphicon glyphicon-plus"></i>Add</button>
          </div>
        </div>
        <div class="clone hide">
          <div class="control-group input-group" style="margin-top:10px">
            <input type="file" name="filename[]" class="form-control">
            <div class="input-group-btn"> 
              <button class="btn btn-danger" type="button"><i class="glyphicon glyphicon-remove"></i> Remove</button>
            </div>
          </div>
        </div>

        <button type="submit" class="btn btn-primary" style="margin-top:10px">Submit</button>

  </form>        
  </div>


<script type="text/javascript">      
    $(document).ready(function() {    
      $(".btn-success").click(function(){ 
          var html = $(".clone").html();
          $(".increment").after(html);
      });

      $("body").on("click",".btn-danger",function(){ 
          $(this).parents(".control-group").remove();
      });    
    });
</script>

Display Page:

 @foreach ($users as $user)
     <img src="{{ url('images/$user->filename') }}"/>
 @endforeach

Hamelraj · Accepted Answer · 2018-11-05 05:32:19Z

2

@foreach ($users as $user)
 @php $images = json_decode($user->filename,true); @endphp
   @if(is_array($images) && !empty($images))
   @foreach ($images as $image)
     <img src="{{ url('images/'.$image) }}"/>
   @endforeach
   @endif
@endforeach

if you save you images as json format this is the way . so i have put if condition also now check

edited Nov 5, 2018 at 5:32

answered Nov 5, 2018 at 5:05

Hamelraj

4,8464 gold badges21 silver badges42 bronze badges

Sign up to request clarification or add additional context in comments.

12 Comments

Almira Enterprise Over a year ago

Tq for the answer @Hamelraj .. but it shows Invalid argument supplied for foreach() :(

Hamelraj Over a year ago

@AlmiraEnterprise i have put if condition also now check

Almira Enterprise Over a year ago

same..it does not display the image

Hamelraj Over a year ago

after foreach @foreach ($users as $user) plz do loke this {{ dd($user) }} ans show me what you will get

Almira Enterprise Over a year ago

{#205 ▼ +"id": 2 +"filename": "["download-1.jpg"]" +"created_at": "2018-11-05 02:58:34" +"updated_at": "2018-11-05 02:58:34" }

|

Naveed Ali · Accepted Answer · 2018-11-05 06:30:50Z

0

In blade template you're inserting json format in img src but instead you should insert single filename. you can see that your filenames are stored as json so you need to decode json format and run foreach for every filename just like below.

@foreach ($users as $user)
   @php $filenames = json_decode($user->filename); @endphp
   //filenames are decoded now and you can use the foreach loop just like below
   @foreach ($filenames as $singlefilename)    
     <img src="{{ url('images/' . $singlefilename) }}"/>
   @endforeach

@endforeach

Hope it will help you

answered Nov 5, 2018 at 6:30

Naveed Ali

1,0458 silver badges16 bronze badges

Collectives™ on Stack Overflow

Display array format image from database in laravel

2 Answers 2

12 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

12 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related