I am trying to display the first image from this array ["11.jpg","16.jpg"], the array is stored in a table column called images. I am writing
<img src="{{ asset('images/properties/'. $files->images) }}" class="">
in my blade.php
Nothing appears but it comes with this when I inspect the element
<img src="http://127.0.0.1:8000/images/properties/["11.jpg","16.jpg"]" class="">
I have also tried to display the first item in the array with this code, but the image doesn't appear.
How can I display the first image in blade.php.
<img src="{{ asset('images/properties/'. $files->images[0]) }}" class="">
Wow!!! i have found the solution.
The answer is to use json_decode() function.
<?php $property_images = json_decode($files->images);?>
<img src="{{ asset('images/properties/'. $property_images[0]) }}" class="">
Use array_first()
The array_first function returns the first element of an array
You have to store the array using json_encode. and while retriving just decode that data using json_decode.
<img src="{{ asset('images/properties/'. array_first(json_decode($files->images))) }}" />
Related
In Laravel, I have written the below code in Blade.php. But the IMAGE won't get displayed. Can anyone please help?
<?php
eval("\$image_url = \"{{ url('public/uploads/trust/".$value.".jpg') }}\";");
?>
<img src="{{ $image_url }}" />
FYI, this is how the code looks from "debugger in browser" as below:-
<img src="{{ url('public/uploads/trust/logo.jpg') }}">
I have a database with images related to one product, and I'd like to take those images there only from the second one.
The code to my view is this. I put a line for each image
#foreach($allImages as $image)
<img src="{{ asset('merchants/images/products/' . $image->image) }}" alt="little picture">
#endforeach
I hope I'm clear enough on what I'd like to do...
#foreach($allImages->skip(1) as $image)
<img src="{{ asset('merchants/images/products/' . $image->image) }}" alt="little picture">
#endforeach
This will skip the first record
You can do something like this to skip the first image in the array
#foreach($allImages as $image)
#if($loop->first){
#continue;
}
else{
<img src="{{ asset('merchants/images/products/' . $image->image) }}" alt="little picture">
}
#endforeach
I hope it is helpful for you
I have been learning "code" just over a year for a project i have and have got stuck on a particular function that i am trying to create for the user. I have lots of divs with different information being rendered from a database. Html and css looks great I have then created blade #sections to hold the info but struggling to add functionality.
#foreach($canal as $canal)
#section('water-left')
<img class="img-responsive" src="{{ asset('images/canals/' . $canal->image)}}">
#section('location')
<strong class="words myh4">{{$canal->name}}</strong>
#section('water-right')
<img class="img-responsive" src="{{ asset('images/canals/' . $canal->image)}}">
#endsection
#endsection
#endsection
#endforeach
I have paginated contents of database to 3 and am trying to attatch the id1 image to ('water-left'), the id2 name to ('location') and id3 image to('water-right') currently i get just id1 in all sections any help please my controller looks like this
public function getcanalimage()
{
$canal = Canal::paginate(3);
return view('waters.canal_fishing',compact('canal'));
}
any help would be much appreciated thanks.
Try to use foreach loop, because $canal is array with more one values and you need use a loop to show all them:
#section('water-right')
#foreach($canal as $item)
<img class="img-responsive" src="{{ asset('images/canals/' . $item->image)}}">
#endforeach
#endsection
It has been a while since the question was posted but, for anyone using Laravel 5.8, there seems to be an undocumented blade tag/directive called #overwrite.
So replacing #endsection with #overwrite should do the work.
#foreach($canal as $item)
#section('water-left')
<img class="img-responsive" src="{{ asset('images/canals/' . $canal->image)}}">
#section('location')
<strong class="words myh4">{{$item->name}}</strong>
#section('water-right')
<img class="img-responsive" src="{{ asset('images/canals/' . $item->image)}}">
#overwrite
#overwrite
#overwrite
#endforeach
I am trying to create a dynamic image link (in Laravel 5.0), like this:
#foreach($result as $r)
<div>
<a href="{{URL::to('productdetail?id=<?php echo $r->id; ?>')}}">
<img src="..\public\uploads\{!! $r->fileName !!}" height="200" width="250"/>
</a>
</div>
#endforeach
and the link it generates is:
http://localhost:8000/{{URL::to('productdetail?id=1'}}
But I want to generate a link like this:
http://localhost:8000/productDetail?id=1
Any help?
Tux almost had it, but you need to put the variable outside the string. This should work:
<a href="{{ URL::to('productdetail?id='.$r->id) }}">
But why are you using a GET variable for this? The beauty of Laravel is that you can have the ID as part of the URL. If I was writing this I would have this in my routes file:
Route::get('/product/{stub}/{id}', ['as' => 'prodDetailPage', 'uses' => 'ProductDetail#index');
Then you could just use <a href="{{ route('prodDetailPage', [$r->stub, $r->id]) }}">
For stub you can create a function to turn the title into a stub, it would need to convert it to lower case, remove special chars and convert spaces to hyphens.
You can directly use:
#foreach($result as $r)
<div>
<a href="{{URL::to('productdetail?id=$r->id')}}">
<img src="..\public\uploads\{!! $r->fileName !!}" height="200" width="250"/>
</a>
</div>
#endforeach
Well, I have got this, actually I was putting the PHP tags at a wrong place, so the final link would be like this:
<div>
<a href="{!! URL::to('productdetail?id=') !!}<?php echo $r->id; ?>">
<img src="..\public\uploads\{!! $r->fileName !!}" height="200" width="250"/>
</a>
</div>
I'm using Laravel to create a project.
Is there a way to concatenate to the end of a url using {{ route('routename') }} in an <a> tag?
I created a list of thumbnail images that link to a collection of fullsize images using a foreach loop.
#foreach ($images as $image)
<a href="{{ route('images') }}"> // link to full size image collection
<img src="{{ $image->url }}">// thumbnail image
</a>
#endforeach
{{ route('image') }} is a link to a paginated page that only contains one image per page.
so the url for the first image is my.site/images?page=1, the second is my.site/images?page=2 and so on and so on.
I'm wanting to route the user to the correct page=# according to the thumbnail they click on so they don't have to start form the beginning of the fullsize images each time the click a link from the thumbnails.
Im thinking I can use a foreach loop to increment a variable by 1 and concatenate that on the end of each href to get the correct page number but I'm not sure how I can do this using Laravel?
Im wanting my resulting html to look like this
<img src="thumbnail1.jpg">
<img src="thumbnail2.jpg">
<img src="thumbnail3.jpg">
<img src="thumbnail4.jpg">
<img src="thumbnail5.jpg">
...
Does anyone know a way?
The method you found out yourself works perfectly fine, but there is a more elegant one. All parameters you pass as second argument that are no actual route parameters (like {page}) will be appended as query string.
{{ route('images', ['page' => $n]) }}
I was able to make this work by using this code
<?php $n = 1; ?>
#foreach ($images as $image)
<a href="{{ route('images') . '?page=' . $n }}"> // link to full size image collection
<img src="{{ $image->url }}">// thumbnail image
</a>
<?php $n++; ?>
#endforeach