Creating a Drill Down Link on a Dynamics 365 Portal Entity Form

The Dynamics 365 CE Portal is great way to extend Dynamics 365 functionality to external users and build powerful web applications.  However, through configuration it still lacks some basic features that internal Dynamics 365 users are used to.  One example of this is the ability to drill down on lookup fields.

If we were to look at an Invoice record directly in Dynamics 365 and we wanted to navigate to see the details of the customer record, we would just need to click on the customer name and the Account screen would appear.

drilldownA
Click on Customer name to drill down into the Account
drilldownb
Account Information directly from drilling down from Invoice

This is basic functionality that has been part of CRM since version 1.0.

On the portal, if we surface the same form on an entity form page, we could change the value but we are not able to drill down and see the details of that account.

drilldownc
No Drill down to Customer record on Portal

Note, we could add a “Quick View” form to the Invoice form as a way to see the details.  However, there might be instances where we want to completely navigate to that particular record on the portal.

This seems like a pretty simple feature that ideally should be part of the Portal solution.

makeithappen

The Solution

The following is a method where we will add a drill down link to the page and wire it to navigate to a page that will display the parent customer details.

The first step is to choose or create a Dynamics 365 form to use as a basis for a portal entity form.  The next step is to create a Entity Form record that will be used to show the Account details.

We would need to make sure that the Record Source Type is “Query String” and we should note the value of the Record ID Query String Parameter Name (default is “Id”)

drilldown1
Entity Form

The next step is to create a corresponding web page where the entity form will be displayed.  You can create this from either within Dynamics 365 or from the front side editing tools of the Portal.  You will need to make sure you choose the Entity Form you created earlier.  For a parent page, choose the page from which you will be navigating from (e.g. Invoice Details)

drilldown2
Web Page details

We also should make sure that the web page is not part of site map or it will add a “unusable” link on the Invoice Details page.

drilldown3
Page hidden from Site Map

In order to not to have to hard code the link on the Invoice Details page, we will add a Site Marker record as a reference to the Account Details web page.

drilldown4
Account Details Site Marker

Now that we have the Account Details web page setup, we will need to create the link on the Invoice Details page.

Here we will use a combination of Liquid and HTML.  Either navigate to the Invoice Detail page with a portal administrator account or via Dynamics 365* and add the following code to the Invoice Details Web Page record:

drilldown5
Liquid and HTML Code to implement the drill down field

*I prefer to edit web page code using front side editing to avoid the cursor jumping around with the Dynamics 365 autosave feature.

We are using Liquid to assign the currently displayed invoice as a Liquid object.  We then retrieve the Site Marker setting (using a site marker means we don’t have to hard code the URL).

Finally we build the URL by combining the Site Marker, adding the parameter (Id) and the GUID of the Account from the Liquid Invoice object.  We also use Liquid to display the name in the Hyperlink text.

The result is now we have a drill down field on the Invoice Detail record on the Portal:

drilldown6
Invoice Detail with a Drill Down!

Clicking on the link we now can navigate to the Account record.

drilldown7
Drill down detail record

Using some Liquid, HTML and a bit of creativity we can easily extend the Dynamics 365 Portal further and build powerful externally facing web applications.

I hope you will find this example helpful in your Dynamics 365 Portal Projects!

victory

UPCOMING APPEARANCES

2017 US Signature files_Im speaking at Gray1

I mentioned last week that I will be at Extreme365 in Long Beach.  I will be participating in the following sessions:

Monday, November 6, 2017 – Extreme365 App Innovation Challenge

Wednesday, November 8, 2017 – Ask the Experts

Thursday, November 9, 2017 – Planning your Dynamics 365 Onprem to Cloud Migration

If you happen to be a Extreme365, please say hi!

Non-CRM or Technology related Appearances

nick2

I will also be competing on Friday, November 17, 2017 at the Ontario Powerlifting Championships

It was a big achievement to be able to qualify for both provincials and nationals last June.  I started Powerlifting 5 years ago and my goal was to be able to qualify to compete nationally.  Now its onward to the next step in my lifting career.  First Provincials and then Nationals in Calgary in March.

Nick Doelman is a Microsoft Business Solutions MVP and will be looking for a spotter for the gym while in California.  Any volunteers?

10 thoughts on “Creating a Drill Down Link on a Dynamics 365 Portal Entity Form

  1. Great article! Where exactly do I embed this code, though? I have tried the custom CSS, custom JS, on the portal side. I have tried the Web Page and Entity form records as well. I even threw it in the top content section of my portal page! But no matter what, I can’t actually see the link. Does it need to be uploaded as a child page to the target page? If so, do you call it xyz.html, or do we have to mask it as JS and then encapsulate the code with and tags?

    Just scratching the surface on portals myself – but this is a great, and much needed, enhancement!

    Like

    1. Hi Brian, In this example, when you edit a page using the front side editor (the FSE appears when you are logged in as an admin) then choose the “options” tab and there will be a spot to paste in the JavaScript code. These days, I prefer to put my JavaScript in a custom web template, but putting it on the web page should work fine. Let me know if this makes sense. Cheers
      Nick

      Like

  2. Looks like all of the HTML tags are stripped out (like my first comment, where it stripped and ) – but I think you get the gist.

    Also – Embedding the code as text instead of an image would certainly be helpful moving forward. Thanks so much.

    Here is the code with some spaces between HTML tags so its more readable….

    Parent Account

    {% assign account = entities.account[params.id] %}

    {% assign parentPage = sitemarkers[“Edit Account11”] %}

    {{account.parentaccountid.name}}

    Like

    1. I wrote that post a while back, lately if I have code I will now put it github as well. What I will do is maybe re-write/update this post to reflect PowerApps Portals and put a related sample project in GitHub, it may take a few days to get done.
      Thanks for reading!

      Like

      1. Thanks for the note and update, Nick. Very much appreciated.

        So, it seems that I am still unable to grab the Parent Account GUID from the Account form. Again, my goal here is to allow a drilldown into the Parent Account of an Account. I have been able to get the Account GUID rather easily since it’s included in the request params, but I cannot get ANYTHING from the parent account.

        I am trying to grab the ID (for link building) and the Name. This is kinda how I have it setup (let’s see if your comment system lets me post this properly)

        Grab account GUID using request params
        –Display Account GUID on form
        Assign a sitemarker to my page variable
        try to build the URL string as such:
        =”{{page.url}}?id={{accountentity.parentaccountid.accountid}}> {{accountentity.parentaccountid.name}}
        (not sure if this will display properly or not).

        Everything seems to work fine, except for the final step of building the URL string. The Parent Account ID is blank in the URL (shown via status bar bottom of browser window), and the parent account name is also blank, shown by a lack of text in the a href tag.

        If I try to just blast out the ParentAccountid.accountid, and/or parentaccountid.name, they are continuously blank.

        I have now tried to inject Fetch as well. Even using fetch, I am able to get the base account (the account on the form), but it never pulls back a Parent Account name or ID. Even tried this with a loop – and all of the accounts ended up showing up on my form (whoops!!), but still, no Parent account information.

        I will keep digging on this. Any additional advice you can offer is greatly appreciated!

        PS – Have you run into trying to increase the number of rows shown on a Portal subgrid? I can’t find anything online as of yet, wondering if the CSS file needs to be updated for that to be increased? As of now, the Form subgrid configs are not overriding the default of 4 rows displayed.

        Like

      2. I will take a look at the parentaccountid issue. In terms of entity list rows, that is determined by the subgrid rows on the model-driven (CRM) form designer. (Classic form designer)

        Like

      3. Thanks! I realized I was looking at a different form that I hadn’t updated the row count for – at least that was nice and simple!! Appreciate you looking into this!

        Like

  3. I guess my main issue is really getting the Parent Account ID (and then any fields that are on that entity record). I have tried to use request params accountid.parentaccountid(.id), I’ve tried to set a variable to request params.accountid, then reference account.id.parentaccountid(.id) in many different ways – but no matter what I do, I cannot get the parent account ID to return a value! It’s always null.

    Like

Leave a comment