In 2020 Release Wave 1 Update for Dynamics 365 introduced navigateTo Client API to open main form of dynamics record in dialog instead Xrm.Navigation.openForm. This helps record to open in new window or same window of browser.
Also with the help of Xrm.Navigation.navigateTo, we can open custom HTML too and we can pass some parameters or accept return values in MSD 365 JavaScript too.
Below, we have provided information about how to open the CRM record in dialog. So to open new form for the entity is by below code snippet ..
var parameters = {};
parameters["soft_para1"] = formContext.data.entity.getId();
parameters["soft_para2"] = formKeyString;
parameters["soft_para3"] = 1;
var pageInput = {
pageType: "entityrecord",
entityName: "soft_entityLogicalName",
data: parameters,
formId: "71ca9461-3209-4740-bd62-7320af2ae89c"
};
Xrm.Navigation.navigateTo(pageInput, { target: 2 }).then(
function success() {
//do something
//do something
},
function error() { }
);
To open existing record use below code snippet
var pageProperty = {
pageType: “entityrecord”,
entityName: “contact”,
formType: 2,
entityId: “979dfe31-0686-ea11-a811-000d3a579c9c”//guid of record
};
var navigationProperty = {
target: 2,
width: { value: 80, unit: “%” },
position: 1
};
Xrm.Navigation.navigateTo(pageProperty, navigationProperty);Now, to show some custom html page
var dialogParameters = {
pageType: "webresource",//required
webresourceName: "ab_/ModalDialog.html",//Html Webresource that will be shown
data: data//optional
};
var navigationOptions = {
target: 2,//use 1 if you want to open page inline or 2 to open it as dialog
width: 400,
height: 300,
position: 1//1 to locate dialog in center and 2 to locate it on the side
};
Xrm.Navigation.navigateTo(dialogParameters, navigationOptions).then(
function (returnValue){
//you can add handling of resultValue here
console.log(returnValue);
//put your success handler here
},
function(e) {
//put your error handler here
});
hope it helps.
Another good thing Navigation …..
We can show some HTML page here as well, we can pass parameters and accept some return value too using same above method.
Passing values to HTML page and accepting values in MSD 365 js which are passed from HTML page
function RestrictedCommand() {
var pageInput = { //pass values to page
pageType: "webresource",
webresourceName: "soft_modelpopup_restrict",
data: "Incident"
};
var navigationOptions = {
target: 2,
width: 500, // value specified in pixel
height: 250, // value specified in pixel
position: 1
};
Xrm.Navigation.navigateTo(pageInput, navigationOptions).then(
function success(returnValue) { //returnValue will return value from HTML page
switch (returnValue.returnValue) {
case "883990000":
window.close();
var ResValue = parseInt(returnValue.returnValue);
//your logic
formContext.data.save();
break;
case "0":
window.close();
//your logic
break;
case "Cancel":
default:
window.close;
}
},
function error() {
// Handle errors
}
);
}Design your HTML page and pass values like below
<html>
<head>
<title>Restriction reason</title>
</head>
<body onload="PoppupOnload()">
<style>
p {
font-family: Calibri;
font-size: 15px;
}
label {
font-family: Calibri;
font-size: 15px;
}
.select {
font-family: Calibri;
}
.button {
background-color: #0047b3;
border: none;
color: white;
padding: 12px 29px;
text-align: center;
font-family: Calibri;
text-decoration: none;
display: inline-block;
font-size: 15px;
margin: 4px 2px;
cursor: pointer;
float: right;
}
</style>
<script src="ClientGlobalContext.js.aspx" type="text/javascript"></script>
<script>
function SubmitClick() {
var e = document.getElementById("soft_reason");
var result = e.options[e.selectedIndex].value;
if (result == "0") {
openAlert("Please select correct reason or click on 'Cancel' button to cancel the action.");
} else {
window.returnValue = result;
window.close();
}
}
function CancelClick() {
window.returnValue = "Cancel";
window.close();
}
function PoppupOnload() {
debugger;
var queryString = location.search.substring(1);
switch (queryString.split("=")[1]) {
case "Incident":
document.getElementById("PersonMessage").style.display = "none";
break;
case "Contact":
document.getElementById("IncidentMessage").style.display = "none";
default: window.close();
}
}
function openAlert(errormessage) {
var alertStrings = { confirmButtonLabel: "OK", text: errormessage };
var alertOptions = { height: 175, width: 350 };
Xrm.Navigation.openAlertDialog(alertStrings, alertOptions).then(
function success(result) {
},
function (error) {
}
);
}
</script>
<p id="IncidentMessage">Please note that by restricting the Case record any child records like Goal, Action taken, General Assessment etc. will also be restricted. If you would like to continue then please provide the reason for restriction below:</p>
<p id="PersonMessage">Please note that by restricting the Person record any open Case record associated to the Person will also be restricted. If you would like to continue then please provide the reason for restriction below:</p>
<label for="dhhs_restrictionreason">Restriction reason:</label>
<select class="select" name="dhhs_restrictionreason" id="dhhs_restrictionreason">
<option value="0">--Select--</option>
<!--<option value="883990000">Person known to staff</option>-->
<option value="883990001">Sensitive case</option>
<option value="883990002">High profile incident</option>
<option value="883990003">Client request</option>
</select>
<br><br>
<input type="submit" class="button" value="Cancel" onclick="CancelClick()">
<input type="submit" class="button" value="Restrict" onclick="SubmitClick()">
</body>
</html>it will look like this …
Hope it helps
Thanks!
CRM/MSD Practice 