You need to sign in to do that
Don't have an account?
Display image in lightning component from attachment/files.
Our notes & attchemnet are accessible through files(ie ContentDocumentLink replacement of attachment object), As we can not access/get attachment through lightning experience.
reference: https://help.salesforce.com/apex/HTViewSolution?urlname=Attachments-are-not-returned-in-Lightning-Experience-search&language=en_US
I want to display the attachment(image file) on lightning component, How can I display it?
I tried following code :
reference: https://help.salesforce.com/apex/HTViewSolution?urlname=Attachments-are-not-returned-in-Lightning-Experience-search&language=en_US
I want to display the attachment(image file) on lightning component, How can I display it?
I tried following code :
<apex:image url="/servlet/servlet.FileDownload—file=06941000000SKtyAAG" width="50" height="50" /> <apex:image url="/servlet/servlet.FileDownload?file={!attchmentId}"/>
Instead can try using html tags in between and call a remote action?
This might be a workaround since lightning allows HTML tags to be nested. Do let us know if that works.
"https://lightningstrikers2016-dev-ed.my.salesforce.com/servlet/servlet.FileDownload?file=06941000000SKtyAAG Failed to load resource: the server responded with a status of 500 (Server Error)"
If I open obove link, salesforce gives this error :
"Unable to Access Page
The value of the "file" parameter contains a character that is not allowed or the value exceeds the maximum allowed length. Remove the character from the parameter value or reduce the value length and resubmit. If the error still persists, report it to our Customer Support team. Provide the URL of the page you were requesting as well as any other related information. "
in your url
https://lightningstrikers2016-dev-ed.my.salesforce.com/servlet/servlet.FileDownload?file=06941000000SKtyAAG
your id start with 069 its ContentDocument id not attachement id so
add image file in Attachment object and try again
Thanks
If this solves your problem, please mark it as the answer.
From Static Resource
Upload logo.jpg
<img src="/resource/logo" />
From Attachment
CreateText Field: Image_Id__c--> Id of Attachment
Create Formula Field: Image__c--> "/servlet/servlet.FileDownload?file="&Image_Id__c
Paste the Id of attachment to Image_Id__c.
Lightning Component: <img src="{!v.Product.Image__c}" alt="Placeholder"/>
I have also tried this thing , but i couldn't display image ..
component:
<aura:component controller="PicGalleryCardCtrl" implements="flexipage:availableForAllPageTypes,force:hasRecordId"
access="global">
<aura:attribute name="fullScreen" type="Boolean" default="false"/>
<aura:attribute name="animations" type="Boolean" default="true"/>
<aura:attribute name="recordId" type="String" />
<aura:attribute name="slides" type="String[]" />
<aura:attribute name="slideIndex" type="Integer" default="0"/>
<aura:attribute name="slideWidth" type="Integer" default="0"/>
<aura:handler name="init" value="{!this}" action="{!c.doInit}" />
<lightning:card iconName="utility:image" title=" Picture Gallery">
<aura:set attribute="actions">
<lightning:buttonIcon onclick="{!c.fullScreen}" size="large" iconName="utility:expand" />
</aura:set>
<aura:if isTrue="{!v.fullScreen==true}">
<div role="dialog" tabindex="-1" aria-labelledby="header43" class="slds-modal slds-fade-in-open">
<div class="slds-modal__container">
<div aura:id="gallery" class="gallery">
<div class="filmstrip" style="{! 'margin-left: -' + (v.slideIndex * v.slideWidth) + 'px'}">
<aura:iteration items="{!v.slides}" var="slide" indexVar="index">
<div class="slide">
<img src="{!slide}" alt="Placeholder" />
</div>
</aura:iteration>
</div>
<div class="{! v.slideWidth>640 ? 'btn prev x-large' : 'btn prev'}">
<lightning:buttonIcon variant="border-filled" onclick="{!c.prev}" size="large" iconName="utility:chevronleft" />
</div>
<div class="{! v.slideWidth>640 ? 'btn next x-large' : 'btn next'}">
<lightning:buttonIcon variant="border-filled" onclick="{!c.next}" size="large" iconName="utility:chevronright" />
</div>
</div>
</div>
<div class="btn slds-modal__close close x-large">
<lightning:buttonIcon variant="border-filled" onclick="{!c.closeDialog}" size="large" iconName="utility:close" />
</div>
</div>
<div class="slds-backdrop slds-backdrop--open"></div>
</aura:if>
</lightning:card>
</aura:component>
server - ctrlr
global with sharing class PicGalleryCardCtrl
{
@AuraEnabled
public static List<String> getImageUrls(Id parentId)
{
List<String> ImgUrlsList=new List<String>();
for(Attachment att : [select Id, Name, ContentType from Attachment where parentid=:parentId and ContentType in ('image/png', 'image/jpeg', 'image/gif')])
{
ImgUrlsList.add('/servlet/servlet.FileDownload?file='+att .id);
}
return ImgUrlsList;
}
}
<img id="img1" src="https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcTAoY07I4a-BFifQMe_3wfTHFf1GHlYoyp_g7SkIMnGzFruRoy2aXdJQIib" >
I'm also facing the same problem. The below code is not displaying the Image "0692w000001OQM4AAO". Resulting in '500 Server Error' Anyone, please let me know how to display an image stored in the Files section of a record using lightning component.