'probleme with loading multiple image laravel 8
I have to make multiple image uploads inside my post's form and then display it as a slideshow in my view. I tried a bunch of tutorials and nothing works. the only one that worked so far has a problem with the upload. I have two tables linked up which are images and posts. then, the images table has a foreign key that will get an id from the posts table.I got it uploaded in the database but only to find out that it was just the same image uploaded multiple times.for example:I upload four different images, but when I display them , there's only one image displayed four times
this is my controller:
public function post(Request $request)
{
$post=new post;
$video=$request->video;
if($video)
{
$videoname=time().'.'.$video->getClientOriginalExtension();
$request->video->move('profilevideo',$videoname);
$post->video=$videoname;
}
$post->titre=$request->titre;
$post->description=$request->description;
$post->tag=$request->tag;
$post->status='available';
if(Auth::id())
{
$post->user_id=Auth::user()->id;
}
$post->save();
$post_id=$post->id;
if($request->hasfile('image'))
{
$files=$request->file('image') ;
foreach($files as $file)
{
$image=new Image();
$image_name=time().'-'.$file->getClientOriginalExtension();
$image_name=str_replace('','-',$image_name);
$file->move('postimage',$image_name);
$image->image=$image_name;
$image->post_id=$post_id;
$image->save();
}
}
return redirect()->back()->with('message','post created successfuly');
}'
my view :
<div class="container" align="center">
<div class="col-lg-8">
<div class="panel">
<div class="panel-content panel-activity">
@if(session()->has('message'))
<div class="alert alert-success">
<button type="button" class="close" data-dismiss="alert">
x
</button>
{{session()->get('message')}}
</div>
@endif
<form action="{{url('post')}}" class="panel-activity__status" method="post" enctype="multipart/form-data">
@csrf
<input type="titre" class="form-control" id="titre" placeholder="post title" name="titre">
<textarea name="description" placeholder="Share what you've been up to..." class="form-control"></textarea>
<input type="tag" class="form-control" id="tag" placeholder="post tag" name="tag">
<div class="actions">
<div class="btn-group">
<button type="button" class="btn-link" title="" data-toggle="tooltip" data-original-title="Post an Video">
<i class="fa fa-video-camera"><input type="file" style="color:black" value="video" name="video"></i>
</button>
<button type="button" class="btn-link" title="" data-toggle="tooltip" data-original-title="Post an Image">
<i class="fa fa-image"><input type="file" style="color:black" value="image[]" name="image[]" multiple></i>
</button>
</div>
<button type="submit" class="btn btn-sm btn-rounded btn-info">
Post
</button>
</div>
</form>
image display view:
<div id="carousel-demo" class="carousel slide" data-ride="carousel">
<!-- Sliding images statring here -->
<div class="carousel-inner">
@if (is_array($images) || is_object($images))
@foreach($images as $image)
<div class="item">
<img class="img-fluid" src="postimage/{{$image->image}}" alt="">
</div>
@endforeach
@endif
<div class="item">
<video class="img-fluid" src="postvideo/{{$post->video}}" alt="">
</div>
</div>
<!-- Next / Previous controls here -->
<a class="left carousel-control" href="#carousel-demo" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left"></span>
</a>
<a class="right carousel-control" href="#carousel-demo" data-slide="next">
<span class="glyphicon glyphicon-chevron-right"></span>
</a>
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
