How to get formContext in HTML Webresource in Dynamics 365

Follow Debajit’s Power Apps & Dynamics 365 Blog on WordPress.com

If you are using on the latest version of Dynamics 365/ CDS online, Microsoft API can you help you do that. A better and supported approach is described here.

Xrm.Page is deprecated. We all know and we have already started revamping our form scripts and replacing Xrm.Page with formContext and gridContext as suggested by Microsoft.

But the ordeal does not end here. And recently I was faced with another challenge. Customers had HTML webresources embedded in their form where they are playing with the form controls using parent.Xrm.Page.getAttribute and parent.Xrm.Page.getControl.

So we thought of removing Xrm.Page from within inline HTML webresources as well. But wait, there is a problem here. How do we get formContext here.

Searched the heck out in Microsoft Docs but could not find a way. Came across this documentation in Microsoft Docs which I think everybody know anyways. It still asks to use parent.Xrm.Page. But our customer wanted to remove all traces of Xrm.Page at one go.

Then how to proceed. First things first. Is there a way to access the formContext inside HTML webresources?

I could not find any. But I believe you can solve so many things by a good design. And I implemented one of it here to solve the problem. My customer liked it and I hope you would like it too.

So I have this custom entity inside which contains a HTML webresource embedded within it. The first thing I did is to store the formContext in a global variable. So I registered a library on form onload of the test entity. Below is the code for the same. I am using namespaces here for better coding convention

// JavaScript source code
if (typeof (ibtrng) == “undefined”) {
    ibtrng = { __namespace: true };
}

ibtrng.formevents = {
    fContext: null,

    onload: function (e) {
        debugger;
         var fContext = e.getFormContext();

Xrm.getParentAttribute = function (attrName) {
            debugger;
            return fContext.getAttribute(attrName);
        };

        Xrm.getParentControl = function (attrName) {
            debugger;
            return fContext.getControl(attrName);
        };

       
    }

};

The code highlighted in yellow just sets the formContext in a global variable.

Check for the code highlighted in green! What am I doing here? Well from the screenshot of Microsoft Docs, it is evident that within the embedded HTML page you can get hold of the Xrm context using parent.Xrm.

So in the parent scope, during from onload, I registered two custom functions in Xrm namespace – getParentAttribute and getParentControl which is internally using the formContext only.

You can define as many custom functions as you want in the parent scope of Xrm namespace.

And now when the HTML page loads, I can get access to the form data. For the sake of this demo I just populate the textbox field on my HTML with the data of the form. Below is the code on load of my HTML Page

function onHtmlPageLoad() {
             debugger;

            var attrName = parent.Xrm.getParentAttribute(“ibtrng_name”);
            var attrValue = attrName.getValue();

            document.getElementById(“txtName”).value = attrValue;
        }

Screenshot

And voila! I can access data without even any trace of Xrm.Page.

Now the bigger challenge – Does it work on UCI? No solution is complete these days if it does not work on UCI.

Works like a charm in UCI too!

Hope you liked it!

Debajit Dutta

(Dynamics MVP)

For consultation/ corporate training visit www.xrmforyou.com or reach out to us at info@xrmforyou.com

Our product offerings:

Role based views for Dynamics 365 (http://www.xrmforyou.com/role-based-views.html)

CRM-Sharepoint Attachment uploader and metadata manager (http://www.xrmforyou.com/sharepoint-integrator.html)

Record Cloner for Dynamics 365 (http://www.xrmforyou.com/record-cloner.html)

Multiselect picklist for Dynamics 365 (http://www.xrmforyou.com/multi-select-picklist.html)