Recently with 2020 Wave 2 you may have noticed that breadcrumbs have disappeared from the headers of Model Driven Apps.  This may have left you (as it did me) with a desire to update the way users can navigate through the application.  One of the ways that we can make a change like this is to open records in Dialogs instead of the main window, known as Main Form Dialogs.

The product group announced this feature way back in February here but only recently have I seen anyone translate this into opening records in this way from the main grid, i.e. overriding the default onclick behavior.  Traditionally there has not been a publicized way to add javascript events to the click handlers of these grids, however this article published in July helps us do just that.  Now, all that is left is to combine concepts from the two articles.

 

First, we need some javascript code to perform the NavigateTo operation and have it open in a dialog compared to the main frame.  This article documents all the available properties, here is a simple implementation of it.  If you trigger the code from the New+ button as well, you'll need separate logic for that.  The example I'll use for this article will help replace the default behavior for the following scenarios:

  1. Opening record forms for main views
  2. Opening record forms for subgrid views
  3. New button for Main record views (not activities, these are separate buttons)
  4. New button for Subgrid record views (not activities)
  5. New button from forms

 

The Javascript that I use for these use cases needs to handle a variety of inputs/contexts:

  1. For opening records from subgrids and views, we need the selected record moniker and the grid control that opened the record, so that we can refresh it when the record is saved and closed
  2. For the New button on main views, we need to have the entity logical name, and the grid control  to refresh after save and close is pressed.
  3. For the New button on subgrids, we need to have the entity logical name, the record it is being created from, and the subgrid control to be refreshed
  4. For the New button on forms, we just need the entity logical name

function addNewMFDFromSubgrid(gridEntityName, parentEntityName, parentEntityId, primaryControl, gridControl)
{
			let pageInput = {
				pageType: "entityrecord",
				entityName: gridEntityName,
				createFromEntity: 
				{
					entityType:parentEntityName,
					id:parentEntityId
				},
			};
			let pct = {
				value:85,
				unit:"%",
			};
			let navigationOptions = {
				target: 2,
				width: pct,
				height: pct,
			};
			Xrm.Navigation.navigateTo(pageInput, navigationOptions)
            .then(
                function () {
					gridControl.refresh();
                }
            ).catch(
                function (error) {
                    // Handle error
                }
            );
}
function newMFD(entity, gridControl){
			let pageInput = {
				pageType: "entityrecord",
				entityName: entity,
			};
			let pct = {
				value:85,
				unit:"%",
			};
			let navigationOptions = {
				target: 2,
				width: pct,
				height: pct,
			};
			Xrm.Navigation.navigateTo(pageInput, navigationOptions)
            .then(
                function () {
					if(gridControl)gridControl.refresh();
                }
            ).catch(
                function (error) {
                    // Handle error
                }
            );
}
function openMFD(selectedItems, gridControl)
{
	if(!selectedItems)
	{
		let pageInput = {
				pageType: "entityrecord",
				entityName: "new_parcel",
			};
			let pct = {
				value:85,
				unit:"%",
			};
			let navigationOptions = {
				target: 2,
				width: pct,
				height: pct,
			};
			Xrm.Navigation.navigateTo(pageInput, navigationOptions)
            .then(
                function () {
					gridControl.refresh();
                }
            ).catch(
                function (error) {
                    // Handle error
                }
            );
	}
	else{
		let selectedItem = selectedItems[0];
 
		if (selectedItem) { 
			let pageInput = {
				pageType: "entityrecord",
				entityName: selectedItem.TypeName,
				entityId: selectedItem.Id,
			};
			let pct = {
				value:85,
				unit:"%",
			};
			let navigationOptions = {
				target: 2,
				width: pct,
				height: pct,
			};
        Xrm.Navigation.navigateTo(pageInput, navigationOptions)
            .then(
                function () {
                    gridControl.refresh();
                }
            ).catch(
                function (error) {
                    // Handle error
                }
            );
    }
	}
}

 

To review the specifics of how to wire this up in the ribbon you can view or install the attached managed solution, or the documentation link from earlier, but in summary, to open items from views/grids you'll need to create a button that has a specific ID, and the Button needs to be attached to a Custom Action with the same ID as the button that executes a custom javascript web resource similar to the sample above.  For this example, I didn't do the work of hiding the button, although this would be something to implement in a production scenario. 

 

Hope someone finds this useful

Matt