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;
-
Brisbane
https://www.eventbrite.com.au/e/usd-omnichannel-masterclass-brisbane-tickets-63038123725
-
Melbourne
https://www.eventbrite.com.au/e/usd-omnichannel-masterclass-melbourne-tickets-63554714863
-
Sydney
https://www.eventbrite.com.au/e/usd-omnichannel-masterclass-sydney-tickets-64302367111
The steps involved in displaying an associated view using the Unified Interface are these;
-
Create a hosted control.
-
Create an action.
-
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 …