Bhubaneswar, Odisha, India
+91-8328865778
support@logyscal.com

Use FormContext and XRM in HTML Web resource in Dynamics 365 or model driven Power Apps

Use FormContext and XRM in HTML Web resource in Dynamics 365 or model driven Power Apps

As Xrm.Page and parent.Xrm are deprecated, you have to use FormContext object and Xrm object using a different approach. This approach will only be used when you added HTML web resource inside a table form as a component.

Follow below steps. The business scenario is given below:

“Display different Notice content using HTML web resource as per different gender is selected on the form.”

Step 1 : Call JS on Load of Form to set content window

You need to prepare a JS while will be called on FORM LOAD and also called from ON CHANGE event of the field for which you want to make the section of web resource populate dynamicaly.

The below script should be called from Onload of Form and OnChange of field. Create a JS Web resource and upload in a solution.

// This should be in a script loaded on the form. 
// form_onload is a handler for the form onload event.
function form_onload(executionContext) {
    var formContext = executionContext.getFormContext();
    var wrControl = formContext.getControl("WebResource_new_2");
    if (wrControl) {
        wrControl.getContentWindow().then(
            function (contentWindow) {
                contentWindow.setClientApiContext(Xrm, formContext);
            }
        )
    }
}

calling from ONLOAD.

Calling from OnChange

STEP 2 : Add the HTML Web Resource in side a section of Form

Edit the form and add the web resource component inside a section of the form. Notice the name of the web resource.

The web resource code is given below.

<html>
 <head>
   <title>Banner</title>
	<script>
	// This script should be in the HTML web resource.
	// No usage of Xrm or formContext should happen until this method is called.
	function setClientApiContext(xrm, formContext) {
		// Optionally set Xrm and formContext as global variables on the page.
		window.Xrm = xrm;
		window._formContext = formContext;
        var gender = formContext.getAttribute("modern_gender").getValue();
		// Add script logic here that uses xrm or the formContext.
		if(gender==197930000)//male
			document.getElementById("mypara").innerHTML = "Members of the club are hereby informed of a proposed educational visit to a few important historical sites in our city which is likely to be scheduled between the 28th and the 30th of Sep. Interested members are required to pay ? 550 (inclusive of transport and snacks) during the zero periods to the undersigned by the 25th of September.";
		else if (gender==197930001)//female
			document.getElementById("mypara").innerHTML =  "As Sports Secretary of G.D.G. Public School, Pune, draft notice in not more than 50 words for your school notice board informing the students about the sale of old sports goods of your school. You are Rohini/Rohit. (Delhi 2010)";
		else //other
			document.getElementById("mypara").innerHTML =  "Students are hereby informed that our school is organising a sale of its old sports goods like cricket bats, badminton & lawn teams rackets, footballs, cricket & football gear etc. in the P.E. Room on 2K1 August, 2Oxx. Those interested in purchasing these can visit the P.E. Room on the assigned date during their free periods or recess time.";
	}
   </script>
 </head>
 <body>
    <h2 style="color:red">Notice :</h2></hr>
	<p id="mypara">All students are hereby informed about a change in school timings from 1st October, 20xx. The school will now start at 9 a.m. & end at 3 p.m. In the past few years, it has been seen that winters are rather severe and it becomes quite difficult to start early due to the extreme cold weather and the dense fog. So these new timings will be followed till further notice.<p>
 </body>
</html>

In the HTML Web resource the JS method is same name as the STEP 1 JS method. Also used the formscript object to get the gender value.

and using if condition changing the paragraph content.

Now if you load the page and change the value of gender field the content of notice paragraph will change.

TEST

Load the new page:

Change the gender as MALE, FEMALE and Other

The value of paragraph changes accordingly.

Hope this helps.

Follow my blog for more trending topics on Dynamics 365, Azure, C#, Power Portals and Power Platform. For training, Courses and consulting, call to us at +91 832 886 5778 I am working more for community to share skills in Dynamics 365 and Power Platform. Please support me by subscribing my YouTube Channel. My YouTube Channel link is this : https://www.youtube.com/user/sppmaestro

You can enroll now !We are giving 30% discount on our Internship Program

Don’t miss the chance to participate in the upcoming Internship Program which will be done using Microsoft Dot Net Web Development Full Stack Technology. The new batch will be starting from May 20, 2024.  We will have most experienced trainers for you to successfully complete the internship with live project experience.

Why to choose Our Internship Program?

Industry-Relevant Projects
Tailored Assignments: We offer projects that align with your academic background and career aspirations.
Real-World Challenges: Tackle industry-specific problems and contribute to meaningful projects that make a difference.

Professional Mentorship
Guidance from Experts: Benefit from one-on-one mentorship from seasoned professionals in your field.
Career Development Workshops: Participate in workshops that focus on resume building, interview skills, and career planning.

Networking Opportunities
Connect with Industry Leaders: Build relationships with professionals and expand your professional network.
Peer Interaction: Collaborate with fellow interns and exchange ideas, fostering a supportive and collaborative environment.

Skill Enhancement
Hands-On Experience: Gain practical skills and learn new technologies through project-based learning.
Soft Skills Development: Enhance communication, teamwork, and problem-solving skills essential for career success.

Free Demo Class Available