Introduction
In this blog we will explore how to pass ‘Xrm’ and ‘formContext’ in HTML pages using the
‘getContentWindow’ client API in Unified Interface of Dynamics 365 CRM so that we can get or set the form attributes inside the HTML web resource. As we all know, parent.Xrm is going to deprecate in near future so below is the supported way to use the ‘Xrm’ and ‘formContext’ in HTML page.
Suppose there is a HTML web resource on Account entity form which shows notes record related to a Parent Account. And from the HTML page we need to read or set some fields on Account record using formContext and also want to do CRUD operations inside the HTML Page using Xrm.webapi. So, the Xrm and formContext won’t be accessed directly in HTML page. To access, you can follow the below steps:
1. Add the below code in the ‘onLoad’ event handler of Account entity. The below code is written in Typescript so you need to compile it in JavaScript and add it on ‘onLoad’ event of the account form.
onLoad(executionContext: any): void {
let functionName: string = “onLoad”;
try {
//validate execution context
if (!CRMWork_Account_Library.isValid(executionContext)) { return }
//get form context
let formContext = executionContext.getFormContext();
//validate form context
if (!CRMWork_Account_Library.isValid(formContext)) { return }
//Get AccountNotes control
let accountNotesControl = formContext.getControl(“WebResource_AccountNotes”)
//Validate control
if (CRMWork_Account_Library.isValid(accountNotesControl)) {
//get getContentWindow
accountNotesControl.getContentWindow().then(
function (contentWindow) {
//Pass xrm and formcontext
contentWindow.setClientApiContext(Xrm,formContext);
}
)
}
}
catch (ex) {
CRMWork_Account_Library.throwError(functionName, ex);
}
}
In the above code, we are accessing the HTML page using getControl method. Using the getContentWindow() which returns a content window instance representing an IFRAME or web resource we are going to pass the parameter ‘Xrm’ and ‘formContext’ in HTML page.
‘WebResource_AccountNotes’ is the name of the HTML web resource control added on the Account form.
2. Bind the above code on ‘Onload’ of the Account form as shown in below screenshot:
3. Now, add the following code in your HTML web resource:
<script>
function setClientApiContext(xrm, formContext) {
//To set the attribute on Account form
formContext.getAttribute(“preferredcontactmethodcode”).setValue(1);
//To do CRUD operation
var data =
{
“subject”: “Sample”,
}
// create Note record
xrm.WebApi.createRecord(“annotation”, data).then(
function success(result) {
console.log(“Notes created with ID: ” + result.id);
},
function (error) {
console.log(error.message);
// handle error conditions
}
);
}
</script>
You can see in above function we have set the value of the ‘preferredcontactmethodcode’ attribute on Account record and we created a new note record using Xrm.webapi functions.
Note: The function name defined in the HTML page i.e. ‘setClientApiContext’ should use the same function name while calling in Onload function of Form event handler.
Conclusion
As illustrated above, you can now pass ‘Xrm’ and ‘formContext’ in HTML pages using the
‘getContentWindow’ client API in Unified Interface of Dynamics 365 CRM.
