One of the general requests we all hear from our users is that they would prefer to use a Dialog window to work on related records instead keep navigating from one back and forth across forms.
Wells the good news is here. In the upcoming 2020 release of power platform, we will be able to open a main form as a model dialog directly from another main form. This will greatly improve the overall productivity of our customers by reducing clicks and unnecessary navigation when working with related records.
‘Xrm.Navigation.navigateTo’ API
So although Microsoft team has given this wonderful feature to us, for now, it can only be achieved programmatically. It is not an out-of-the-box option which one can just enable and use it. We need developer to help us out here.
Open a New Record in a Dialog
We can add a button on the form’s command bar and click on that to create a new related record when needed using below sample code. We can also add a button on the sub-grid ribbon or we can replace the OOB ‘+New’ button and add a new button to utilize this feature.
function OpenNewContact()
{
Xrm.Navigation.navigateTo(
{
pageType: "entityrecord",
entityName: "contact",
formType: 2
},
{
target: 2,
position: 1,
width: {
value: 70,
unit: "%"
}
});
}Open an Existing Record in a Dialog
If we have the record type and GUID of an existing record, we can use below sample code to open an existing record in a model popup and work on it without leaving the parent form.
function OpenExistingContact()
{
Xrm.Navigation.navigateTo(
{
pageType: "entityrecord",
entityName: "contact",
formType: 2,
entityId: "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx"
},
{
target: 2,
position: 1,
width: {
value: 70,
unit: "%"
}
});
}
Open a Lookup record in a Dialog using OnLookupTagClick event
Natraj Yegnaraman has shared this hidden event ‘OnLookupTagClick‘ which allow us to trigger a function when the user clicks the tag in a lookup control. Using this event and combining it with ‘naviagteTo‘ API, we can open any lookup record in a model popup of record’s Main Form.
All we need to do is use a generic function and add it on all the lookup on our form.
function OpenDialogForLookup(executionContext)
{
var formContext = executionContext.getFormContext();
formContext.getControl('parentcustomerid').addOnLookupTagClick(context => {
context.getEventArgs().preventDefault();
const lookupTagValue = context.getEventArgs().getTagValue();
Xrm.Navigation.navigateTo(
{
pageType: "entityrecord",
entityName: lookupTagValue.entityType,
formType: 2,
entityId: lookupTagValue.id
},
{
target: 2,
position: 1,
width: {
value: 70,
unit: "%"
}
});
});
}
I think this is one of the best UI enhancement and in the near future, most of us will be utilizing this feature. Try it out step by step and if you can thing better use-cases for this feature, kindly share them with the community.
Till next time, Cheers 😉
