Placing dynamic contact image in CRM form

  • Article

Placing Dynamic Contact Image in CRM
Form:

This post explains you how to keep image for every contact.
When you just use web resource to add contact image you have the problem of
having the same image for each and every contact. To make a workaround for this
we can have dynamic images for each contact. Let us say you have different
contacts available for your organization and for each of them you have to add an
image, this concept will be perfect to resolve the issue.

Prerequisites:
To achieve this requirement
you should have a unique field in the contact entity. When you are creating a
new contact, you should also create a new web resource of type image with name
same as the unique field of the contact. This will help to dynamically generate
images for each and every contact available in your organization.

Step 1:
Add an image web resource with the
unique name of the contact record that is created as shown in the below figure.
Web resources can be found when you click on Customizations - Customize the
system as shown in the below figure.

Now click on the new button to add the web
resource and select the type of the web resource as JPG as shown in the below
figure. Also the remember the name of the web resource should be prefixed with
the unique name of the contact record as shown in the below image.

For ex:
You
have a unique name of the contact field as "ContactId". The value of Contactid
is "1234". The name of the web resource which should be created is new_1234
where "new" is the attribute prefix.

Step 2:
After entering
all the values in the web resource save the record. As soon as you save the
record the url of the web resource can be found as shown in the below
image.

Step 3:
Now add
an iframe to contact form as shown in the below image and place the url of the
iframe as "about:blank". This url will dynamically be changed to the web
resource url in the next steps. In the iframe properties uncheck the checkbox
"Restrict Cross Frame Scripting".

 

Step 4:
Now navigate to the form properties of the contact entity and add the
following script.

var contactLogo =
"https://orgname.crm.dynamics.com//WebResources/new_" +
Xrm.Page.getAttribute("new_uniquefield").getValue();

Xrm.Page.getControl("IFRAME_contactimage").setSrc(contactLogo);

In this new_uniquefield will be the contact unique field which is created and
IFRAME_contactimage will be the name of the iframe which you give while creating
the iframe.