Search code examples
javascriptjquerydynamics-crm-2011dynamics-crmdynamics-crm-online

Load a JavaScript event the last in CRM form

I have one image saved in Notes with every form in my CRM Online 2013 custom entity. I am using the following code to query the image and show it in an Image tag in a Web Resource on the form. For debugging purposes I was calling the following code through a button, but I want this process of querying the Notes and displaying the image in the web resource to be automatic when the form load. Here is my code:

<html><head><meta charset="utf-8"></head>


  <body>

   <img id="image" src="nothing.jpg" style="width: 25%; height: auto;" />
    <script type="text/javascript">
    $(windows).load(function()
    {
    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 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 
            {
                alert(SDK.REST._errorHandler(this));
            }
        }

    };

     var x = new XMLHttpRequest();
    x.open("GET", result, true);
    x.onreadystatechange = function () 
    {
        if (x.readyState == 4 && x.status == 200)
        {
            var doc = x.responseXML;

            var title = doc.getElementsByTagName("feed")[0].getElementsByTagName("entry")[0].getElementsByTagName("content")[0].getElementsByTagName("m:properties")[0].getElementsByTagName("d:DocumentBody")[0].textContent;
                document.getElementById('image').src ="data:image/png;base64,"+title;

        }

    };
    x.send(null);



   });



    </script>
    </body></html>

I have removed the button tag..now I want this the query to happen on page Load, but nothing happens when I refresh the form. In my opinion the function loads before the annotation loads. Is there a way to make it wait and load the last?

Solution

  • If you want to wait for the parent window to load I think $(windows).load(myFunction); should do the trick.

    Maybe $ is undefined because you did not add jQuery to your webressource.

    There are also a few little mistakes and unattractive things:

    First: You will get a wrong server url. If you want to access the Xrm-object in a webresource you always have to use window.parent.Xrm or you put it in a variable var Xrm = window.parent.Xrm;

    For example: 

    var Xrm = window.parent.Xrm;
var recordId = Xrm.Page.data.entity.getId();  
var serverUrl = Xrm.Page.context.getServerUrl().toString();

    Second: The ODataPath variable is not declared. Use var ODataPath= serverUrl+ODATA_ENDPOINT; instead. By the way the value of the ODataPath has nothing to do with OData. It is more the REST-Endpoint of Dynamics CRM.

    My script would look like this:

    var Xrm, recordId, serverUrl, restEndpointUrl, odataQuery, fullRequestUrl, xmlRequest;

Xrm = window.parent.Xrm;
recordId = Xrm.Page.data.entity.getId();  
serverUrl = Xrm.Page.context.getServerUrl().toString();
restEndpointUrl = serverUrl + "/XRMServices/2011/OrganizationData.svc";
                               ^ I think a '/' was missing there

odataQuery = "/AnnotationSet?$select=DocumentBody,FileName,MimeType,ObjectId&$filter=ObjectId/Id eq guid'" + recordId + "'";
fullRequestUrl = restEndpointUrl + odataQuery;

    I also dont understand why you use the second HttpRequest.

    All of this code is not tested.