USD – Associated Views (Unified Interface)

I am currently VERY hard at work preparing training material for three courses I’ll be delivering in Australia in August. During my preparation I realised that the logic for displaying associated views in Unified Service Desk was different between the Classic web interface of Dynamics 365 and the newer Unified Interface. In this post I will document how to display an associated view using USD and the Unified Interface. (As I noticed several forum posts with people asking how to achieve this.)

But first …. If you are a USD fan and based in Australia you mighty be in luck! As we still have a few spaces available, checkout this links below;

The steps involved in displaying an associated view using the Unified Interface are these;

  1. Create a hosted control.
  2. Create an action.
  3. Trigger the action, say when you load an account.

Step One – Create a hosted control

You’ll need a hosted control to display the associated view in.

Field Setting
Name I called mine “Associated Cases”, you will obviously give it a name that works for you!
Component Type Unified Interface Page
Hosting Type Chrome Process (Other types are available!)
Application is Global Don’t’ select this, we want this tab in our session.
Display Group I used LeftPanelFill

But you could also use RightPanel or MainPanel.

Step Two – Create an action

Next you will need an action to display your associated view.

Field Setting
Name I called mine “Associated Cases – Associated View”, you will obviously give it a name that works for you!
Hosted Control Associated Cases

Or whatever you called your hosted control!

Action Associated View
Data etn=account

Id=[[account.Id]]

navItemId=navService

hideNavigationBar=true

hideCommandBar=true

etn is the name of the entity you want to display the associated view from. In my example I want to show cases associated with an account.

Id, this is the GUID of the account. Typically the replacement parameter [[account.Id]] will give me that.

navItemId, this is the name of the navigation item from the ui.navigation.items. Confused! Not sure what to use. (See note below.)

I wanted to supress any unwanted navigation do hideNavigationBar and hideCommandBar were set to true.

So what if you aren’t sure of the navItemId? I quickly wrote some code which would loop round my navigation items. As a test I added this to the OnLoad event of my account form. I noted the values I needed and then removed the code again. There might be quicker ways to find this information but this approach worked well and was pretty easy. The code I uses is shown below;

function OnLoad() {
  var navs = Xrm.Page.ui.navigation.items.get();
  for (var i in navs) {
    var nav = navs[i];
    alert("Name:" + nav.getLabel() + "   ID:" +nav.getId());
  }
}

Step Three – Trigger the action

There are probably loads of ways to trigger this action! Maybe you could have a toolbar button that when clicked would open the associated view.

In my simple example I just added the action to the PageReady event of my account hosted control. As that is triggered each time the account form finishes loading. Simples!

My Test

Below you can see that the associated view is displayed in the left panel of my USD solution. What I really like about the Unified Interface in USD is that the small space available in the LeftPanelFill (or RightPanel) triggers the mobile version of the form to render. I think it makes for a great user experience.

Displaying associated views is a simple task easily completed!

It is just one of the many things you could learn during my training course in Australia. Come can join us, you won’t regret it …

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s