Open HTML Web Resource and Pass Parameter using navigateTo Client API Power Apps
Here in this example you will learn how to open a HTML Web Resource and pass parameters tot web resource and use of navigateTo function.
JS Code below.
function openWebResource(primaryControl)
{
//debugger;
var selectedRow =
primaryControl.getControl("contactgrid").getGrid().getSelectedRows();
var selectedRecordId =
selectedRow.getAll()[0].getData().getEntity().getId().replace('{', "").replace('}', "");
var selectedRecordName =
selectedRow.getAll()[0].getData().getEntity().getPrimaryAttributeValue();
var selectedContact =
{
ContactName: selectedRecordName,
ContactId: selectedRecordId
};
var pageInput = {
pageType: "webresource",
webresourceName: "hel_/html/contact/ShowContacts", // Web-Resource Schema name
data: JSON.stringify(selectedContact) // pass parameter here
};
var navigationOptions = {
target: 2,
width: 400,
height: 400,
position: 1 // Open in Center
};
Xrm.Navigation.navigateTo(pageInput, navigationOptions).then(
function success() {
// Run code on success
},
function error(error) {
Xrm.Utility.alertDialog(error.message);
}
);
}
HTML Web Resource
<html>
<head>
<script type="text/javascript">
function onload()
{
GetSelectedRecord();
}
function GetSelectedRecord()
{
// debugger;
var id = "";
var name = "";
if (location.search != null) {
if (location.search.split("=")[1] != null) {
id = JSON.parse(decodeURIComponent(location.search.split("=")[1]))["ContactId"];
name = JSON.parse(decodeURIComponent(location.search.split("=")[1]))["ContactName"];
}
}
var table = document.getElementById("tblOrgActivity");
var rowCount = table.rows.length;
var row = table.insertRow(rowCount);
row.insertCell(0).innerHTML = id;
row.insertCell(0).innerHTML = name;
}
</script>
</head>
<body onload="baseContacts.onload()">
<div id="mydata">
<div>
<table id="tblOrgActivity" border="1">
<tr>
<td>Name</td>
<td>ID</td>
</tr>
</table>
</div>
</div>
</body>
</html>
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
