I created a Model and Database and can upload an image using the Media Finder.
I set Media Finder field as photo in fields.yamal.
But after uploading, no image path is saved to the database in the photo column.
Database Tables
id (integer)
title (string)
photo (string)
Twig
{% for product in builderListCatalog.records %}
{{ product.title }}
<img src="{{ product.photo }}" />
{% endfor %}
This successfully displays the Title but not the Photo path because it is empty in the database.
You need to remove all the relation added to that field from model.
You are using public $attachOn remove it that is the issue now its treated like file attachment relation not a finder image so it will not store path of image in that photo (string) field in table
If you use media finder you just need to add normal string (photo) field in table no need to add any relation in model and it will just store selected file path in that field for ex. /someimage.png
Now to show it in front-end you can use
<img src="{{ model.photo|media }}" />
In component partial you can use
<img src="<?php echo 'https://october-plaza.com/storage/app/media/' . $model->photo ?>" />
if any doubt please comment.
Related
I'm saving my uploaded image in public folder like
public/user/user_img_1.jpg
and saving
/user/user_img_1.jpg
in my database column as image path. Now when i get it
<img src="{{ $userData->thumb_img }}" alt="Profile Image" /> , the image shows on localhost but on server the image is not found. $userData variables stores the path.
We need to give permissions in Laravel for uploading and fetching the images.
Suppose you have saved the image in the public folder under the user folder.
Directory Path: public/user/
And save the image in Database like below:
key: thumb_img
value: "public/user/imagename.jpg"
{{ asset($userData->thumb_img) }}
You need to use the asset function for fetching the image.
Use asset function to generate a URL for an asset using the current scheme of the request.
In your case that would be: <img src="{{ asset($userData->thumb_img) }} alt="Profile Image" />
You have to do any one step :
Put all your files (img) into the public folder.
<img src="/user/{{ $userData->thum_img }}" alt="Profile Image" />
Or, Use asset helper :
<img src="/user/{{ asset($userData->thum_img) }}" alt="Profile Image" />
where user_img_1.jpg is path of your content.
I've been developing a Real Estate component for several of my clients. I have most everything working, except getting images from a separate table.
One example of a site model is City. Within the city model, the primary get (query) is a list of properties, based on the city. Example, if from either the cities view, or menu item, a city such as Dallas is selected, then in the single city view only property listings where property city = Dallas will show.
That part is working great, as it is supposed to. The problem is that every listing has multiple images, stored in an images table. On the property list view, only a single image (out of potentially many) needs to be pulled an displayed.
Adding as a "linked" sub-query within the main properties query doesn't work, as it will create multiple duplicate property listings for each image. So, I created as a custom method, get image.
The compiler that I am using to aid in the building doesn't support a signature method (method that takes values), so I needed to add as a class value. In the getItems function for properties, I created the class value of:
$this->a_property_id = $item->id;
Then, in the getImage custom function I added
$query->where('a.propid = ' . $db->quote($this->a_property_id));
as part of the query. In theory, this should pull a single item where a.propid equals the property id, such as property id=3, then pull an item from images where propid=3.
Lastly, I added the image code in the site view default.php as part of the foreach:
<?php foreach ($this->items as $item): ?>
<li>
<div class="uk-grid uk-panel uk-panel-box">
<div class="uk-width-medium-1-3">
<?php if(empty($this->image->path)){ ?>
<div> <img class="uk-thumbnail uk-thumbnail-medium" src="<?php echo JURI::root().'media/com_mostwantedrealestate/images/No_image_available.png'; ?>"> </div>
<?php } else { ?>
<div> <img class="uk-thumbnail uk-thumbnail-medium" src="<?php echo JURI::root() . $this->image->path . $this->image->filename; ?>"></div>
<?php } ?>
</div>
<div class="uk-width-medium-1-3 uk-float-left">
<a href="<?php echo 'index.php?option=com_mostwantedrealestate&view=property&id='.$item->id;?>" title="<?php echo $item->name;?>" rel="" >
<h3><?php echo $item->name; ?></h3>
</a>
</div>
This is kind of working, but not completely, so I'm unsure what I may be missing. With the way I have this coded, it's displaying an image. If there is only a single property listing, then it shows the proper image, however if there a, lets say, two properties: id=1 and id=3, then it shows propid=3 from the image table for both listings, rather than showing propid=1 for id=1 and propid=3 for id=3.
Any thoughts on what I might be missing?
You're looping over the $this->items but you use the same $this->image object for all of them. So you see the same image over and over again.
You can fix this by adding the image information to the item. Since you want to show just one image you can easily do this with single query joining your item table and your image table.
Another way is to combine the necessary data from different queries in your model so you can use something like $item->image->path.
I am working on a template for my home page, pulling html for certain sections from the database. For example, I have a slider with editable text. The text stored in the DB for slide two is
"Name is a multipurpose venue <br /> Empowering people and their passions"
But when I return this in my template, it converts the < to < and > to > which just causes "<br />" to display on the page.
Is there any way to stop this?
To echo out a string without any alterations, use {!! !!} syntax instead of {{ }}.
Is there a way to check if the file exists in Twig for an image uploaded in a newly created post?
The way I have my post setup is if an image is not uploaded the Twig template will show an empty box with the proportions of where the image should be, but it's a blank box that's awkward to look at.
Question, is if there is a specific command to use with an if statement to check if a file exists if so, display the image code if not do not display the image code.
Image code: (this is the code I want to hide if no image exists to get rid of the empty box)
<div class="entry-thumbnail">
<img width="230" height="172" src="{{ asset(['images/', post.image]|join) }}" class="" alt=""/>
</div>
you could write a twig extension and use some code like this:
use Symfony\Component\Filesystem\Filesystem;
use Symfony\Component\Filesystem\Exception\IOException;
use Symfony\Component\Finder\Finder;
$this->fs=new Filesystem();
if (!$this->fs->exists($directory)) {
$this->logger->info("there is no ".$directory." ...");
} else {
$this->logger->info("Directory ".$directory." already exists.");
}
but i would rather use javascripz like
in your img tag :
<img ... onError="this.src='imagefound.gif';" />
update:
The image Tag has an onError-Handler that triggers when the image in the src attribute is not found. So instead of using this simple inline syntax you could do the same like :
pseudo jquery code:
$(document).on('error','img',function(){
$(this).attr("src","../path/to/placeholerImage.png");
});
I have a quite simple doctrine entity that represent a news ; this news can be linked with many pictures, so I decided to use a Doctrine Collection. The thing is, I want to retrieve this pictures and display them in my template... But it didn't seem to work. Do you know how I can do that ?
Here is what I tried :
{% for annonce in annonces %}
<div class="annonce_item">
{% for photo in annonce.photo %}
<img src="{{ photo.path }}" alt="" />
{% endfor %}
</div>
<!-- End .annonce_item -->
{% endfor %}
annonce is the news class, and photo is the collection :
/**
* #ORM\OneToMany(targetEntity="Photo", mappedBy="id",cascade={"persist"})
*/
private $photo;
When I try to display this page in my browser, I get this exception:
An exception has been thrown during the rendering of a template ("Notice: Undefined index: >id in >/Applications/MAMP/htdocs/ApacheImmobilier/vendor/doctrine/lib/Doctrine/ORM/Persisters/Basi>cEntityPersister.php line 1274") in "APPagesBundle:Index:index.html.twig" at line 45.
Thanks!
Read this article of the doc. It says:
The mappedBy attribute designates the field in the entity that is the
owner of the relationship.
which, in your case, must be the news field of your Photo entity.