You need to sign in to do that
Don't have an account?
bharath kumar 52
Display list of images from Attachment object in a lightning component
Hi All,
I am new to lightning development and am trying to accomplish the following :
1.)Display a list of pictures stored in attachment object.
2.)Select a pic and save it as dp.
Below is my implementation of the same. But i am not able to display them on the screen.
Can someone tell me where i am going wrong because i am not able to display the list of attachments on the screen which is the primary step.
However, when i change it to any other sobject i am able todisplay those records on the screen.
I am new to lightning development and am trying to accomplish the following :
1.)Display a list of pictures stored in attachment object.
2.)Select a pic and save it as dp.
Below is my implementation of the same. But i am not able to display them on the screen.
<!-- Component --> <aura:component implements="force:appHostable,flexipage:availableForAllPageTypes" controller="displayAttchmentList" access="global"> <!--force:LightningQuickAction,force:hasRecordId,--> <aura:handler name="init" action="{!c.returnAttList}" value="{!this}" /> <aura:attribute name="atlist" type="String"/> <!-- <aura:attribute name="contactId" type="String" default="0032800001EXXan"/> <aura:attribute name="Pic" type="String"/> --> <div> <table class="slds-table slds-table--bordered slds-table--cell-buffer"> <thead> <tr class="slds-text-title--caps" style="background: rgb(159, 170, 181);"> <th scope="col"> <div class="slds-truncate" title="Id">Id</div> </th> <th scope="col"> <div class="slds-truncate" title="Body">Attachment body</div> </th> </tr> </thead> <tbody> <aura:iteration items="{!v.atlist}" var="acc"> <tr> <td> <div class="slds-truncate">{!acc.Id}</div> </td> <td> <div class="slds-truncate"><img src="https://resttestdomain-dev-ed.lightning.force.com/one/one.app#/sObject/0032800001EXXanAAH"/></div> </td> <!-- <td> <div class="slds-truncate"><ui:outputRichText value="{!acc.body}"/> </div> </td> --> </tr> </aura:iteration> </tbody> </table> </div> </aura:component>
//Controller ({ returnAttList : function(component, event, helper) { var actionImage = component.get("c.getImage"); /* actionImage.setParams({ parentId : component.get("v.actId") });*/ actionImage.setCallback(this, function(a){ var lsa=a.getState(); if(lsa==="SUCCESS"){ component.set("v.atlist",a.getReturnValue()); console.log('Peace'); console.log('LSA1 >>>>'+lsa); } else if(lsa==="ERROR"){ var error=response.getError(); console.log('LSA2 >>>>'+lsa); if(errors){ if(errors[0] && errors[0].message){ console.log(errors[0].message); } } } /* var attach = a.getReturnValue(); component.set("v.imageSrc", "/servlet/servlet.FileDownload?file=" + attach.Id); console.log('>>>>>>>>>'+attach); */ }); $A.enqueueAction(actionImage); } })
//ApexMethod @AuraEnabled public static list<Attachment> getImage(){ //Id parentId return [select Id, Name,Body, ContentType from Attachment where parentid='0032800001EXXanAAH' and ContentType in ('image/png', 'image/jpeg', 'image/gif')]; }
Can someone tell me where i am going wrong because i am not able to display the list of attachments on the screen which is the primary step.
However, when i change it to any other sobject i am able todisplay those records on the screen.
Your approach is trying to display the body of the attachment, this is problematic for 2 reasons:
- You did not select the body in your SOQL, but even if you did - this should not work, and not a good practice.
- Best practice for displaying an attachment is formatting its URL path with the attachmentId and displaying it like this (inside your <aura:iteration>):
Hope this helps.Thanks,
Nagendra
Learn How to 𝗗𝗶𝘀𝗽𝗹𝗮𝘆 𝗜𝗺𝗮𝗴𝗲𝘀 In 𝗟𝗶𝗴𝗵𝘁𝗻𝗶𝗻𝗴 𝗖𝗼𝗺𝗽𝗼𝗻𝗲𝗻𝘁 ☁️⚡️ Even for related objects.
𝗟𝗜𝗡𝗞 -
https://lnkd.in/gUcq79T
𝗚𝗘𝗧 𝗔𝗡𝗗𝗥𝗢𝗜𝗗 𝗔𝗣𝗣 -
lttps://lnkd.in/f2rXdwN (https://lnkd.in/f2rXdwN)
(𝗟𝗲𝗮𝗿𝗻. 𝗛𝗲𝗹𝗽. 𝗦𝗵𝗮𝗿𝗲.)
#salesforce #lightning #development