Wednesday, 17 June 2020

USING THE NEW MODAL DIALOG TO OPEN FORMS IN DYNAMICS 365 USING XRM.NAVIGATION.NAVIGATETO




We will access these modal forms through JavaScript. In this example, we will select an account record and open the Contact form as a modal.
So we’ll start on an Account record:
The command is:
Xrm.Navigation.navigateTo(pageInput,navigationOptions).then(successCallback,errorCallback);
We will pass through the following command to our browser developer console (you can call this from anywhere you need to):
Xrm.Navigation.navigateTo({pageType:”entityrecord”, entityName:”contact”, formType:2}, {target: 2, position: 1, width: {value: 50, unit:”%”}});
We see the modal Contact form opens over the Account form:
If we click outside the Contact form (on the Account form), we are unable to get focus back to the Account form. The idea here is that the user can be on a Dynamics 365 page, and then view or work on another record, and be able to get back to the original record easily.

Close, Minimize, Maximize

The user needs to click on the X close button or Save and Close.
Also note the option to pop this out to Full Screen Mode:
Which takes up the whole browser window:
We can click to get back to the original modal size:
Let’s look at the options available when opening modals. We are passing objects with the attributes:
Page Input = {pageType:”entityrecord”, entityName:”contact”, formType:2}
Navigation Options = {target: 2, position: 1, width: {value: 50, unit:”%”}}

Size

Let’s open a form to 95%. Note we can pass the width unit as % or px, and then the unit.
We see the 3 columns on the form can be displayed as a result:
Xrm.Navigation.navigateTo({pageType:”entityrecord”, entityName:”contact”, formType:2}, {target: 2, position: 1, width: {value: 95, unit:”%”}});

Position

We can also pass in the Navigation Options position = 2, we the form now opens to the side (1 = center):
Xrm.Navigation.navigateTo({pageType:”entityrecord”, entityName:”contact”, formType:2}, {target: 2, position: 2, width: {value: 500, unit:”px”}});
This is similar to a quick create form, though we’re seeing all the tabs available for selection.
We could enlarge this side view by making the size bigger:
Xrm.Navigation.navigateTo({pageType:”entityrecord”, entityName:”contact”, formType:2}, {target: 2, position: 2, width: {value: 60, unit:”%”}});

Existing Record

To open an existing record, we can do the following, passing the Id of the record to open:
Xrm.Navigation.navigateTo({pageType:”entityrecord”, entityName:”account”, formType:2, entityId:”71f0728d-c25f-ea11-a811-000d3a3be299″}, {target: 2, position: 1, width: {value: 50, unit:”%”}});
Or on the side:
Xrm.Navigation.navigateTo({pageType:”entityrecord”, entityName:”account”, formType:2, entityId:”71f0728d-c25f-ea11-a811-000d3a3be299″}, {target: 2, position: 2, width: {value: 50, unit:”%”}});

Entity List

navigateTo can also be used with with entity lists. For the pageType, passing entiylist will open the list:
Xrm.Navigation.navigateTo({pageType:”entitylist”, entityName:”account”}, {target: 2, position: 1, width: {value: 50, unit:”%”}});
And we can pass the Id of a view to open it:
Xrm.Navigation.navigateTo({pageType:”entitylist”, entityName:”account”, viewId:”61273827-328e-e011-95ae-00155d9cfa02″}, {target: 2, position: 1, width: {value: 50, unit:”%”}});

Web Resources

We can also open web resources. For example, if we have a web resource below:
With the name new_TestWebResource.html:
We can open it like below:
Xrm.Navigation.navigateTo({pageType:”webresource”, webresourceName:”new_TestWebResource.html”}, {target: 2, position: 1, width: {value: 50, unit:”%”}});
And on the side:
Xrm.Navigation.navigateTo({pageType:”webresource”, webresourceName:”new_TestWebResource.html”}, {target: 2, position: 2, width: {value: 50, unit:”%”}});
It looks like Microsoft *could* add more parameters and therefore functionality to this capability, which would be interesting. Andrew Butenko has a good post on some of the limitations with using this for web resources

No comments:

Post a Comment