Open dynamics record in dialog/Modal popup using navigateTo Client API

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.

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.

Thanks!