+ Start a Discussion
Jim BoudreauxJim Boudreaux 

Displaying Attached jpg in VF Page

How does one go about retrieving multiple jpgs that are attached to a given custom object, selecting one based on a filename saved in a related custom object, and displaying that jpg in visual force markup?

This is the use case:

I have a custom object for buildings. I have a custom object for floors, related to the building object through a master-detail relationship. I attach a jpeg of the floor plan to the floor record. I then want to grab the floors of a given building and display the floorplan jpg for each floor in that building.
Best Answer chosen by Admin (Salesforce Developers) 
jwetzlerjwetzler
I tried this simple case with contacts.

Code:
<apex:page standardController="contact">
  <apex:repeat value="{!contact.notesandattachments}" var="image">
    <apex:image url="{!URLFOR($Action.Attachment.Download, image.id)}"/>
  </apex:repeat>
</apex:page>

 It just loops through all of the attachments and displays the image.  Does this help get you started?  Seems like you could get rid of the repeat and replace image.id with a getter in your controller that queries for the right image.

All Answers

harlequinharlequin

Not quite sure what you mean Jim, surely you can get the floor objects associated with the building, then just loop through them getting the filenames of the jpgs into a list of strings, then display them using an <apex:repeat> tag.

Forgive me if I'm being a bit thick.

Jim BoudreauxJim Boudreaux
its the "getting the filename" part that is eluding me.

How do I get the jpg attached to the floor record?
harlequinharlequin
How are you saving the jpgs, are they a static resource or a file on an external site? And presumably there must be custom field in the 'floor' object which references the the filename somehow, this is the field you need. If you can give a bit more info on where the jpgs are stored, and how you reference them in your 'floor' object it would help.
Jim BoudreauxJim Boudreaux
the files are attached via the "Notes and Attachments" Related List.
harlequinharlequin

Jim, I've had no success in finding a solution to your problem, however there is an article which may help you achieve what you want. Sorry I can't be of more help.

http://assets.salesforce.com/pdf/getting_started_with_images_v1.pdf

jwetzlerjwetzler
I tried this simple case with contacts.

Code:
<apex:page standardController="contact">
  <apex:repeat value="{!contact.notesandattachments}" var="image">
    <apex:image url="{!URLFOR($Action.Attachment.Download, image.id)}"/>
  </apex:repeat>
</apex:page>

 It just loops through all of the attachments and displays the image.  Does this help get you started?  Seems like you could get rid of the repeat and replace image.id with a getter in your controller that queries for the right image.

This was selected as the best answer
Jim BoudreauxJim Boudreaux
assuming this works for custom objects, then I think this is what I needed.

One question, is 'notesandattachments' a standard field for all objects that lists the attachments on an object?
jwetzlerjwetzler
I believe so.  Just tried the same thing with a custom object and it worked fine.

It's just a related list, it works the same way myCustomObject__c.myCustomRelationship__r does.
Jim BoudreauxJim Boudreaux
Success!

For anyone who is wondering, here's the key:

This SOQL query returns the fields in my Floor__c object along with a list of attachments named 'floorplan.jpg', which should only be one file.:

select name, name__c, exits_to_ground__c, (Select Id From NotesAndAttachments where title='floorplan.jpg') from floor__c where id = :id

Then I use the code provided above to repeat through the list of one result to display the floorplan.


As an aside, it would be much nicer if there was a file upload field that held files, then we could avoid all this by just calling th file custom field.
If you agree, go promote such an idea at the idea exchange.
Jim BoudreauxJim Boudreaux

Thanks for the help Jill. To show that your efforts were not in vain, check out this session from Dreamforce 2010:

 

http://www.youtube.com/watch?v=HYg20Jmp6NU&m=25

 

Skip to the 25 minute mark and enjoy.


jwetzler wrote:
I tried this simple case with contacts.

Code:
<apex:page standardController="contact">
  <apex:repeat value="{!contact.notesandattachments}" var="image">
    <apex:image url="{!URLFOR($Action.Attachment.Download, image.id)}"/>
  </apex:repeat>
</apex:page>

 It just loops through all of the attachments and displays the image.  Does this help get you started?  Seems like you could get rid of the repeat and replace image.id with a getter in your controller that queries for the right image.