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>