How to display an image from an image attachment is Notes in CRM Online 2013 RRS feed

  • Question

  • I have on image attached in annotation of every record I have in a custom entity. I am using the following code to get the URL for the entity with the image attached successfully. 
    function GetData(){
    		var recordId = window.parent.Xrm.Page.data.entity.getId();	
    		var serverUrl = Xrm.Page.context.getServerUrl().toString();
    		var ODATA_ENDPOINT = "XRMServices/2011/OrganizationData.svc";
    		var objAnnotation = new Object();
    		ODataPath= serverUrl+ODATA_ENDPOINT;
    		//var ODATA_EntityCollection = "/AnnotationSet";
    		var temp= "/AnnotationSet?$select=DocumentBody,FileName,MimeType,ObjectId&$filter=ObjectId/Id eq guid'" + recordId + "'";
    		var result =serverUrl + ODATA_ENDPOINT + temp; 
    		var retrieveRecordsReq = new XMLHttpRequest();
    retrieveRecordsReq.open('GET', ODataPath + temp, false);
    retrieveRecordsReq.setRequestHeader("Accept", "application/json");
    retrieveRecordsReq.setRequestHeader("Content-Type", "application/json; charset=utf-8");
    retrieveRecordsReq.onreadystatechange = function () {
        if (this.readyState == 4 /* complete */) {
            if (this.status == 200) {
                this.onreadystatechange = null; //avoids memory leaks
                var data = JSON.parse(this.responseText, SDK.REST._dateReviver);
                if (data && data.d && data.d.results)
                    SuccessFunc(JSON.parse(this.responseText, SDK.REST._dateReviver).d.results);
            else {
    Now how do I use the URL (below) that I get to show the image in a web resource form? In my head I need to extract the documentbody which is in base64 and pass it to an image tag. Any help?
    "https://{ORG_Name}/XRMServices/2011/OrganizationData.svc/AnnotationSet?$select=DocumentBody,FileName,MimeType,ObjectId&$filter=ObjectId/Id eq guid'{F0B933C8-4E12-E411-9666-6C3BE5A8516C}'"

    Monday, July 28, 2014 9:56 AM

All replies

  • Hi,

    I believe your SuccessFunc() would be something like this:

    function SuccessFunc(imageData)
    	if(imageData !=null && imageData.DocumentBody != null)
    		var encodedImg = imageData.DocumentBody;
    		//Considering the image tag in your Web Resource has id 'entity_image'
    		$("#entity_image").attr("src","data:image/jpeg;base64," + encodedImg);

    If your images are anything but jpeg, you'll need to change it accordingly like "data:image/png;base64," if it's png.

    Admin QuikView Solution for CRM 2013

    Monday, July 28, 2014 10:34 AM
  • It gives me an error on

    var encodedImg = imageData.DocumentBody;

    "Unable to get property DocumentBody of undefined or null reference."

    Monday, July 28, 2014 11:08 AM
  • Hi,

    Can you check if you're able to retrieve the Document Body from the script you provided by debugging it?

    Admin QuikView Solution for CRM 2013

    Monday, July 28, 2014 11:20 AM
  • Well that is exactly what I want to know how to do so?
    Monday, July 28, 2014 1:01 PM
  • sorry for the late reply. I just checked the xml and it contains the documentbody node with the documentbody in it. How do i extract it from there?
    Monday, August 4, 2014 7:57 AM