Feb 8, 2012, 4:15 AM
22 Posts
topic has been resolvedResolved

Image display in form

  • Category: Other
  • Platform: Windows
  • Release: 8.5.3
  • Role: Developer
  • Tags:
  • Replies: 3
 Hi
 
I am a Domino developer who is taking his first steps in XPages so please be patient with me. I have about 15 years development experience in LotusScript etc. Up until now I have only done Notes client development.
 
The application I am trying to add a couple of XPages to is a staff database. I download data from our AS/400 and our HR department then adds a photo of the staff member. I have a rich text lite field that contains the photo. I have setup the second tab on the field to be thumbnail and to resize on import to 240 x 274 pixels - I copied this from the personal names.nsf database. I would now like to display the staff document (name, telephone number, department and a photo) in xPages. I have everything working except the photo (it was really VERY simple :o). The xPages application part is only going to be used to VIEW the data, editing will be done in Notes.
 
I have tried the following:
 
1. add the photo into a RichTextItem and display the using the Rich Text core control - this works but I don't like it as the background is white and my page is blue. It just doesn't look very good. It also would require that all the photos be updated - HR will not be happy.
 
2. I found this code for a view column somewhere and tried to add it to a Rich Text control as well as an image control as a computed data value - I couldn't get it to work
 
var _docUNID = entry.getDocument().toString();
var _fp = database.getFilePath();
return '<img class="avatar" src="/' + _fp + '/0/' + _docUNID + '/$file/photo" />'
 
Does anybody have a solution for me?
 
Thanking you in advance 
Ursus Schneider 
Feb 8, 2012, 6:53 AM
150 Posts
Re: Image display in form
 
I may not have the whole picture... 
 
But you need to figure out the url to the picture ,which you can do using the path you tried (try the real url in the browser first)
once you find that you can easily refrence it using an image control
 


Feb 8, 2012, 8:20 AM
22 Posts
Re: Image display in form
 Hi Thomas
 
Thank you very much for your reply - you got me on the correct path. 
 
Should anybody else have this problem here the solution: 
 
1. On your Notes form create a Rich Text Lite field and limit the imput to Thumbnail. Give the created attachment a name (I used photo in this example). Remember that in my app the data is created using the Notes client. 
 
2.  On your xPage create a core control of type image
 
3. add the following JavaScript as the computed value for the image source: 
 
var doc:NotesDocument = currentDocument.getDocument ();
var UID:string = doc.getUniversalID().toString();
var fp:string = database.getFilePath();

return '/0/' + UID + '/$file/Photo'
 
4. That's it! 
 
The image now gets displayed if there is one. I used the following code in the hide value for the image control to not display the broken image when no photo is present:
 
if(@AttachmentLengths()===0) { 
return false 
} else { 
return true
}
 
Thank you again for the pointer 
Greetings from cold Austria (-15 °C this morning) 
Ursus 
 
 
 
Feb 8, 2012, 8:55 AM
150 Posts
Re: Image display in form
Nice to see you solved it.
 
Also try stackoverflow.com next time.
 
/Thomas