Sunday, May 26, 2024

Lock a Field on an Editable Subgrid using JavaScript in Dynamics 365

How to Use JavaScript to Lock a Field on an Editable Subgrid in Dynamics 365

In this blog post, I'll demonstrate how to use JavaScript to lock a specific field on an editable subgrid within a Dynamics 365 form. This ensures that users cannot update its values directly within the subgrid. For this example, we'll focus on the "Contacts" subgrid and lock the "emailaddress1" field.

Refer to this video for a detailed implementation guide


--Steps to Implement Field Locking with JavaScript--

Step 1: Create a JavaScript Web Resource

First, you need to create a JavaScript web resource that contains the code to lock the field.

  1. Navigate to your Dynamics 365 solution.
  2. Go to Web Resources and create a new JavaScript (JS) web resource.
  3. Add the following code to the web resource and save it.

JavaScript c0de below - 

function onGridRowSelected(context) {

    console.log("Function Triggerred for Locking subgrid field...");

        context.getFormContext().getData().getEntity().attributes.forEach(function (attr) {

        console.log("Attribute name: ", attr.getName());

        if (attr.getName() === "emailaddress1") {

            console.log("Found 'emailaddress1' field.");

            attr.controls.forEach(function (myField) {

                console.log("Disabling 'emailaddress1' field...");

                myField.setDisabled(true);

                console.log("'emailaddress1' field disabled.");

            });

        }

    });

}

Step 2: Add the JavaScript Web Resource to the Form

Next, you'll add this JavaScript web resource to the form that contains the editable subgrid.

  1. Open the Main Form for the entity (e.g., Account) that contains the subgrid.
  2. Click on Form Properties .
  3. Under the Form Libraries section, click Add and select the JavaScript web resource you created.
  4. Click OK to add the web resource to the form.

Step 3: Attach the JavaScript Function to the Subgrid Event

Now, you'll attach the `onGridRowSelected` function to the OnRecordSelect event of the subgrid.

  1. Select the subgrid on the form.
  2. In the right-hand pane, find the Events section.
  3. Click Add to add a new event.
  4. Choose OnRecordSelect as the event.
  5. In the Library dropdown, select the JavaScript web resource you added earlier.
  6. In the Function field, enter `onGridRowSelected`.
  7. Ensure that Pass execution context as first parameter is checked.
  8. Click OK to save the event configuration.













Step 4: Publish

Finally, publish all customizations to apply the changes.

  1. Click Save and Close on the form editor.
  2. In the solution, click Publish All Customizations .


 # Testing the Implementation

To verify that the field locking functionality works correctly:

  1. Navigate to the form containing the Contacts subgrid.
  2. Select a row in the subgrid.
  3. Attempt to edit the "emailaddress1" field.












You should notice that the "emailaddress1" field is now disabled and cannot be edited, ensuring the values remain unchanged.

 # Conclusion

By following these steps, you can effectively lock a specific field in an editable subgrid using JavaScript in Dynamics 365. This approach can be particularly useful for maintaining data integrity by preventing users from altering critical information directly within subgrids.

Stay tuned for more tips and tricks on optimizing your Dynamics 365 experience! If you have any questions or need further assistance, feel free to leave a comment.

Creating Editable Sub-grids for Forms and Views in Dynamics 365

How to Convert a Subgrid on a Form to an Editable Subgrid in Dynamics 365

In this blog, I will show you how to convert a sub-grid on a form to an editable sub-grid in Dynamics 365. This feature allows users to edit records directly within the sub-grid, enhancing the user experience by eliminating the need to navigate to a different screen.

 Understanding the Scenario

Let's take a look at an example to understand the requirement better. Imagine you have an "Investment" form with a sub-grid displaying contacts. Currently, this sub-grid is not editable in-line, meaning you have to open each record individually in a new form to make changes. This process is cumbersome and time-consuming. The goal is to make the sub-grid editable in-line, directly on the form.

Refer to this video for a detailed implementation guide

Steps to Convert Sub-grid to Editable

Step 1: Access the Main Form

  • Navigate to your solution in Dynamics 365.
  • Go to the Investment entity and select Forms .
  • Open the Main Form that contains the sub-grid you want to edit.

Step 2: Edit the Form

  • Once the form is open, you will see the sub-grid you want to make editable.
  • Select the sub-grid. On the right-hand side, you will find the Properties pane with three sections:  Display , Formatting , and Component .

Step 3: Add Editable Grid Component

  • In the Component section, click on Add Component and choose Editable Grid .
  • This will open a small screen where you can configure the editable grid settings.










Step 4: Configure the Editable Grid

  • Select the sub-grid view and specify which table it is connected to. In this case, it connects to the "contacts" table.
  • Choose the view you want to display in the editable grid.
  • Configure additional options such as filtering, grouping, and device compatibility.
  • Click Done to finalize the configuration.

Step 5: Publish the Form

  • Publish the form to apply the changes.
  • After publishing, refresh the form to see the editable sub-grid in action.

 # Testing the Editable Sub-grid

Once the form is published and refreshed, navigate back to the Investment form to test the editable sub-grid:

1. Open the form and find the contacts sub-grid.

2. Click on a cell to edit the value directly in-line.

3. Make changes such as updating relationship types, verifying statuses, or changing contact information.

4. If you double-click, it will open the record. To edit in-line, just click once.

5. The changes will be auto-saved when you move out of the row, or you can manually save using the Save button.



 # Additional Configurations

 Grouping and Filtering

- You can enable grouping by specific fields such as name or contact.

- Filtering options allow you to narrow down the records displayed in the sub-grid.

 # Conclusion

By following these steps, you can enhance the functionality of your Dynamics 365 forms by making subgrids editable.

Followers

Power Dynamix YouTube Videos