ifeanyicode's avatar

Hi guys please help, I'm working on an app that will display multiple images on view.

'' for now, I can be able to upload and save the images in the public path but I can not display them on view. Note: I WAS ABLE TO DISPLAY one on view but displaying all the images user upload at once is not working please help

Here is my controller $title = $request->input('title'); $user_id = Auth::user()->id; $body = $request->input('body'); $location = $request->input('location'); $category = $request->input('category');

    if ($request->hasfile('files')) {
        foreach ($request->file('files') as $file) {
            $extension = $file->getClientOriginalExtension(); // getting image extension
            $filename = time() . '.' . $extension;
            $file->move(public_path() . 'storage/postImages/', $filename);
            $imgData[] = $filename;
        }




        $post = new Post();
        $post->title = $title;
        $post->user_id = auth()->id(); // add this line
        $post->body = $body;
        $post->location = $location;
        $post->category = $category;
        $post->name = json_encode($imgData); //Don't use json
        $post->image_path = json_encode($imgData); // Don't use json



        $post->save();


        return back()->with('success', ' Post created successfully! ');
    }
}

}

''

0 likes
16 replies
ifeanyicode's avatar

the view ''' @foreach ($posts as $post )

                        <div class="post__medias">


                            <img class="post__media" src="{{ asset($post->image_path)}}" alt="post image" />

                        </div>
     @endforeach

'''

tykus's avatar

Each $post has multiple image paths (stored as JSON); do you cast the image_path property as JSON on the Post model?

// Post
protected $casts = [
    'image_path' => 'array',
];

Then in the view:

@foreach ($posts as $post )
    <div class="post__medias">
        @foreach($post->image_path as $image_path
            <img class="post__media" src="{{ asset($image_path)}}" alt="post image" />
    </div>
@endforeach

Aside... a separate images table (where a Post has many Images) would be easier to manage.

1 like
ifeanyicode's avatar

The images are displaying together to the view, but they are not displaying the way I set for each slide in CSS

ifeanyicode's avatar

,,, class Post extends Model { use HasFactory; protected $table = 'posts'; protected $fillable = [ 'title', 'body', 'user_id', 'location', 'category', 'files' => 'array', 'files.*'

];

//we have post and it belongsTo a user

public function user()
{
    return $this->belongsTo(User::class);
}

,,,

ifeanyicode's avatar

The images are not displaying with proper CSS styling, they are just listed in the view. but once I remove the protected casts in my model and upload, then put back the code protected $casts = [

    'image_path' => 'array',

];

it will display perfectly. I don't know whats wrong

Snapey's avatar

You are giving all the images the same filename because the time() function will return the same value for all images uploaded together

ifeanyicode's avatar

@Snapey The image array is coming to the view quite well but they are not coming with CSS styling to make it a sliding image, rather they all display together. but when I remover the protected casts and upload, once I add back the code, the images will display with the proper style in view. i don't know what is causing this

Please or to participate in this conversation.