Use Attachments field in item format for lookup - contact list

[ragesoft]

Hi,
i'm looking for a item format to display a contact from a contact list like in the blog post here: https://spform.com/cross-site-lookup/se ... office-365

I want to show the image of a contact (if exists) and the first + last name.

Is it possible, because the attachments field is bit tricky

[Nikita Kurguzov]

Dear ragesoft,
All you need to do, is add an Image column to the Contacts list. Image column can be either Hyperlink or Picture column type. Storing picture in Attachments might not be the best thing as there can be multiple attachments per file, but if you can have Hyperlink column that always has the correct URL, this will be much easier.

You will also need to know the Internal names of the First Name and Last Name columns, they can be different from their title, for example, "First_x0020_Name" and "Last_x0020_Name" - that's how SharePoint stores names with spaces. You can check internal names if you go to List Settings, open the column and check its name in URL:

InternalNameListSettings.png (15.06 KiB) Viewed 9543 times

Now, that you know both the Internal Names of First Name and Last Name, as well as the URL/Picture field for Image, simply insert the following Request Items code to the Cross-site Lookup:

Code: Select all

function (term, page) {
  if (!term || term.length == 0) {
    return "{WebUrl}/_api/web/lists('{ListId}')/items?$select=Id,{LookupField},Image,First_x0020_Name,Last_x0020_Name&$orderby=Created desc&$top=10";
  }
 
  return "{WebUrl}/_api/web/lists('{ListId}')/items?$select=Id,{LookupField},Image,First_x0020_Name,Last_x0020_Name&$orderby={LookupField}&$filter=startswith({LookupField}, '" + term + "')&$top=10";
}

And the following code to Item Format:

Code: Select all

function(item) {
  return '<div style="clear: both; height: 25px;">' +
    '<div style="width: 45px; float: left;"><img style="margin-top: 3px;" src="' + item.Image.Url + '"></div>' +
    item["First_x0020_Name"] + item["Last_x0020_Name"] +
    '</div>';
}

[ragesoft]

Hi Nikita,

thx for the tip with the picture column, but thats no option for the default contact list shipping with sharepoint.
We use it in combination with outlook and outlook will store a picture for the contact as "ContactPicture.jpg" in a subfolder with the id of the list item (e.g: "/Lists/contacts/Attachments/5138/ContactPicture.jpg").

So all i have to do now, should be:
check if there are attachements for the contact and if there is at least 1, use it for contact...
is this possible with the display template?

[Nikita Kurguzov]

Dear ragesoft,
If you know the actual URL, it might be even easier. Use the following code for Item Format instead, this should work for default Contacts list if you select Last Name as a Lookup Field:

Code: Select all

function(item) {
  return '<div style="clear: both; height: 25px;">' +
    '<div style="width: 45px; float: left;"><img style="margin-top: 3px;" src="/sites/siteName/subsite/Lists/contacts/Attachments/' + item["Id"] 
    + '/ContactPicture.jpg"></div>' + item["FirstName"] + item["{LookupField}"] + '</div>';
}

Just make sure that the URL points to the file correctly and it should be displayed properly.