Update Lookup Field Display Name in Dynamics 365 with JavaScript

Gif showing how it looks when changing the display name using JavaScript

This article explains how to update the lookup field display name in Dynamics 365 with JavaScript. The steps involve adding a JavaScript function that retrieve related record and fields from the related table, and updating the display name accordingly. The function can be added to the on-change and on-load events of the form, and the changes will only be reflected on the record referencing the lookup record. The article also includes examples of the JavaScript code for adding both the product name and number or only the product number as the display name.

Table of Content

• Update Lookup Display Name with JavaScript
• How to Add the JavaScript Function to the Form
• Conclusion
• Resources

Prerequisites

• Familiar with Dynamics 365
• Familiar with JavaScript

Update Lookup Display Name with JavaScript

In this example, we look at how we can update the lookup field display name of the product table in Dynamics 365 with JavaScript. By showing the product number in addition to the name of the product, or only the product number. In the image below the default display name of the product table lookup field is shown and this is what we want to change.

Image of how the standard display name looks on the case table referencing the product table.

By using JavaScript we change the display name by adding the product number in addition to the product name as seen below.

Image of how it looks on the case form combining the product number and name.

The JavaScript example below shows how to add the product number in addition to the product name in the lookup field as seen in the image above.

var sdk = window.sdk || {};
(function () {
    "use strict"
    this.setProductDisplayName = async function (executionContext) {
        const formContext = executionContext.getFormContext();
        let productColumn =…