user upload multiple image and it stored in array form. how to display those images in laravel blade file?
when i tried i got this error.
htmlspecialchars() expects parameter 1 to be string, array given (View: C:\Users\user\laravel2\newfyp\resources\views\postqs\show.blade.php)
show blade :
<img src="/image/{{ $postqs['image'] }}"
style="width:150px; height:150px;"> </td>
model:
protected $casts = [
'image'=>'array', ];
protected $fillable = ['image'];
create blade
<div class="form-group">
<label class="control-label col-sm-2" >image test:
</label>
<form action="upload" id="upload" enctype="multipart/form-data">
<input type="file" name="image[]" id="image" multiple><br />
</form>
<div id="message"></div>
Try :
#foreach($postqs['image'] as $imagePath)
<img src="/image/{{ $imagePath }}"
style="width:150px; height:150px;">
#endforeach
</td>
protected $fillable = [''image'];
Is that a typo with the double quote?
If the images are in an array simply loop over the array and create an img for each.
Have you tried something like the following in your view file:
#foreach ($postqs['image'] as $image)
<img src="asset({{ $image }})" />
#endforeach
First of all you should correct this line:
protected $fillable = [''image']; // ['image'] and not [''image']
htmlspecialchars(): I always get this error when the variable is null.
A simple solution would be wrap your html with:
#if($yourVar)
#endif
You can also dump your variable to show how the structure is.
Good luck.
Related
I am trying to build a facebook clone on livewire, and i wanted to assign each comment section its own model so that's why i created an empty array in my class,
public $new_comments = array();
then for each post i tried to assign to its comment section 2 models (one for the comment body and the second one for the picture) based on the post id
<form class="form-group" wire:submit.prevent="test">
<input name="message" required class="form-control" placeholder="Write a comment..." wire:model="new_comments.{{ $post->id }}.body"></input>
<label for="comment_image" style="cursor: pointer"><i class="flaticon-photo-camera"></i></label>
<input type="submit"></input>
<input id="comment_image" type="file" wire:model="new_comments.{{ $post->id }}.image" class="d-none" accept="image/png, image/gif, image/jpeg">
</form>
#if ($new_comments[$post->id]['image'] ?? false)
<div class="d-flex justify-content-center">
<img src="{{ $new_comments[$post->id]['image']->temporaryUrl() }}" class="w-50">
</div>
#endif
but when i try uploading an image in the post number 1 for example, it always gets added in the last item of the array and i don't know why!
in this case i uploaded the image in the first post but magically its in the last item of the array
(you can notice that the other model is working perfectly fine!)
Can anyone help me with this problem? Thank you.
When I am uploading an image to the form and returning it from the controller, the image name and extention are changing.I am a beggar, so if I make a mistake while asking a question, I would like to apologize.
This is my form:
<form action="{{ route('admin.slider.store') }}" method="POST" enctype="multipart/form-data">
#csrf
<div class="row">
<div class="col-md-12">
<label class="control-label">Image</label>
<input type="file" name="image">
</div>
</div
<button type="submit" class="btn btn-success">Save</button>
</form>
This is my controller:
public function store(Request $request)
{
$this->validate($request, [
'image' => 'required|mimes:jpeg,bmp,png,jpg',
]);
$image = $request->file('image');
return $image;
}
My image file name is :demo.jpg
Controller return result is like that:
C:\xampp\tmp\php5E86.tmp
This is the same result when I give another picture, only the last four characters are changing.
C:\xampp\tmp\phpF239.tmp
It is very helpful to know why I am getting .tmp file return.
use getClientOriginalName to get orginal file name
$request->image->getClientOriginalName()
To get file extension
$request->image->extension();
or
$name = $request->file('image')->getClientOriginalName();
$extension = $request->file('image')->extension();
Ref:https://laravel.com/docs/8.x/filesystem#other-uploaded-file-information
When using an input file to load images with Livewire I found that if the user clicks to load multiple images it works correctly, but if he clicks on the same input a second time, the previews with Livewire are replaced by the selected images. second time. To solve this add an array that loads the images as follows:
My input file
<input wire:change="cargaImagenes" wire:model="imagen" type="file" name="imagen" accept="image/*" class="form-control-file" multiple>
Event Charge
public function cargaImagenes()
{
foreach ($this->imagen as $ima) {
array_push($this->imagenes, $ima);
}
}
The problem is that I do the previews of the images with Livewire in the following way:
#if ($imagenes)
<small>previsualización:</small>
<div class="form-inline">
#foreach($imagenes as $img)
<div wire:key="{{$loop->index}}">
<div class="m-2 img-thumbnail">
<img class="my-2 rounded img-fluid contenedor-img" src="{{ $img->temporaryUrl() }}">
<button class="btn btn-outline-danger" wire:click="eliminarImagen({{ $loop->index }})">
</button>
</div>
</div>
#endforeach
<br>
</div>
#endif
And the problem is that they don't show the first time I select images, it shows when I add more.
For the preview I use the $images property of the array
array_push($this->imagenes, $ima);
Can you give me a suggestion of what I could do to display all the images in the array.
This should work.
Remove wire:change completely.
<input wire:model="imagen" type="file" name="imagen" accept="image/*" class="form-control-file" multiple>
Hook on the updatedImagen() event method:
public function updatedImagen()
{
foreach ($this->imagen as $ima) {
$this->imagenes[] = $ima;
}
}
here is my code form my controller
i9ts seem to Image::get() not working when I use image::all() then its work
public function index(){
$images = Image::get();
return view('home', compact('images'));
}
here is my home.blade.php
<div class="container">
<div class="row justify-content-center">
<form action="{{route('ablum.store')}}" method="POST" enctype="multipart/form-data">
#csrf
<input type="file" name="image" class="form-control">
<button class="btn btn-primary" type="submit">submit</button>
</form>
#foreach($images as $image)
<p> this is image name {{$image->name}}</p>
#endforeach
</div>
</div>
when I navigate to the home view I get this error
$images is undefined
Make the variable optional in the blade template. Replace {{ $images }} with {{ $images ?? '' }}
how can I solve this ?
You can try and rewrite your controller code like this:
return view('home')->with(compact('images'));
Official Laravel docs here does not say anything about any second parameters to view() helper.
with() should actually append the data and $images should be available in blade now.
Also, for simplicity, just use Image::all(). If this again is not working, you can try and ditch the compact method and in with() send an array like:
return view('home')->with(['images' => $images]);
I am trying to get an item to display a link to PDF if that item has a PDF associated with it. I am not sure how the if statement would be formatted. I am using Laravel for this.
Here is the code that I have in the controller for the item:
//PDF Upload
if($request->hasFile('spec_sheet')) {
//Get file name and extension
$filenameWithExt = $request->file('spec_sheet')->getClientOriginalName();
//Get just file name
$filename = pathinfo($filenameWithExt, PATHINFO_FILENAME);
//Get Ext
$extension = $request->file('spec_sheet')->getClientOriginalExtension();
//Store file name
$fileNameOfPdfToStore = $filename. '.' .$extension;
//Upload
$path = $request->file('spec_sheet')->storeAs('public/mcelroy-specs', $fileNameOfPdfToStore);
}
$rental = new Rental;
$rental->title = $request->title;
$rental->name = $request->name;
$rental->description = $request->description;
$rental->product_image = $fileNameToStore;
$rental->spec_sheet = $fileNameOfPdfToStore;
$rental->save();
In the view I have this:
#foreach($rentals as $rental)
<article class="cards-item">
<figure class="card product">
<div class="card-images">
<img src="/storage/rentals/{{$rental->product_image}}" alt="" >
</div>
<figcaption class="card-content">
<h1 class="card-title">{{ $rental->title }}</h1>
<h2 class="card-title product_title">{{ $rental->name }}</h2>
<p class="card-text" style="text-align:left;">{{ $rental->description }}
#if(!empty($spec_sheet))
Download Spec Sheet
#endif
</p>
<form action="{{ route('cart.store') }} " method="POST">
{{ csrf_field() }}
<input type="hidden" name="id" value="{{ $rental->id }}">
<input type="hidden" name="title" value="{{ $rental->title }}">
{{-- <input type="hidden" name="pickupDate" value="{{ $rental->pickupDate }}">
<input type="hidden" name="returnDate" value="returnDate"> --}}
<div class="buttons">
<div class="back">
<button class="primary button" type="submit">Add to Cart</button>
</div>
</div>
</form>
</figcaption>
</figure>
</article>
#endforeach
Seems like you are looking for the right way to do something in Laravel, but there is no right way.
Given
#if(!empty($spec_sheet))
Download Spec Sheet
#endif
I would make two changes, 1) shouldn't $spec_sheet be $rental->spec_sheet? and 2) swap out the #if(!empty(...)) with #unless(empty()) as I feel that including a ! will make it harder to understand when you come back to this in a few weeks.
So I am suggesting you use this which should be just fine, since there's no right way to do this in Laravel.
#unless(empty($rental->spec_sheet))
Download Spec Sheet
#endunless
Your code above will not work if there is no PDF attached, as the variable $fileNameOfPdfToStore will not exist and a hard error will be thrown. But assuming you fix that issue and store an empty string for the file name or perhaps NULL instead of the file path, then you could create a new attribute in the Rental model that looks like this:
public function getHasSpecSheetAttribute() {
return $this->spec_sheet==null? false:true;
}
Then in your view you would do this:
#if($rental->hasSpecSheet)
Download Spec Sheet
#endif
In order to fix the PDF upload code, just put an else statement and put this inside of it:
$fileNameOfPdfToStore = null;
#if(strlen({$rental->spec_sheet) > 0))
Download Spec Sheet
#endif
use string length to determine if there was file name uploaded or not