Managing Duplicated Lookup Field Visibility in Dynamics 365 Forms

Managing Duplicated Lookup Field Visibility in Dynamics 365 Forms

Introduction: In Dynamics 365 and Power Platform model-driven apps, customizing form behavior to fit complex business requirements is a common practice. A unique challenge presents itself when a form includes duplicated lookup fields that represent the same underlying data attribute but are intended for different purposes. These fields might be named sequentially (e.g., "productid", "productid1", "productid2") to indicate their duplication. To ensure a clean and user-friendly interface, it's crucial to dynamically manage the visibility of these fields based on user interactions. This article delves into a JavaScript solution that leverages column labels to determine which duplicated field has been changed and adjust visibility accordingly.

Requirement Overview: The implemented JavaScript solution must fulfill the following criteria:

  • Identify Changed Field: Utilize column labels to ascertain which duplicated lookup field has been modified by the user.
  • Dynamic Visibility Adjustment: Hide the other duplicated fields when one is populated to streamline user focus and maintain form cleanliness.
  • Restore Visibility on Clear: If the user clears the populated field, reveal all duplicated fields again to allow for a new selection.

Solution Approach: To address these requirements, we attach a JavaScript function to the onChange event of each duplicated lookup field. This function identifies the changed field by comparing column labels and dynamically adjusts the visibility of all duplicated fields based on the current field's value.

Sample Code with Comments:


function onProductidChange(executionContext)
{
    var formContext = executionContext.getFormContext();
    var eventSource = executionContext.getEventSource();

    var control = eventSource.controls.get(0);
    var controlLabel = control ? control.getLabel() : "";
    var value = control.getAttribute().getValue();

    var control1 = formContext.getControl("productid1");
    var control2 = formContext.getControl("productid2");
    var control3 = formContext.getControl("productid");

    if(value) // If the changed column has a value
    {
        // Set visibility based on the control label
        if(controlLabel === control1.getLabel())
        {
            control2.setVisible(false);
            control3.setVisible(false);
        }
        else if(controlLabel === control2.getLabel())
        {
            control1.setVisible(false);
            control3.setVisible(false);
        }
        else if(controlLabel === control3.getLabel())
        {
            control1.setVisible(false);
            control2.setVisible(false);
        }
    }
    else // If the changed column is emptied, make all columns visible
    {
        control1.setVisible(true);
        control2.setVisible(true);
        control3.setVisible(true);
    }
}

Implementation Steps:

  1. Incorporate the JavaScript code into a web resource within your Dynamics 365 environment.
  2. For each duplicated lookup field ("productid", "productid1", "productid2"), attach the onProductidChange function to the onChange event via form customization.
  3. Verify that the script is loaded with the form to enable the dynamic visibility logic based on user actions.

Conclusion: This JavaScript strategy provides a practical solution for dynamically managing the visibility of duplicated lookup fields in Dynamics 365 forms. By comparing column labels to identify the changed field, the solution enhances the user interface, guiding users through data entry while preventing input errors and ensuring form cleanliness. This approach demonstrates the flexibility of client-side scripting in customizing Dynamics 365 to meet intricate business process requirements.

No comments:

Post a Comment