Lock fields on Editable Grid using JavaScript in Dynamics 365 CRM

June 11, 2024 priyeshwagh777 D365 WebAPI / JavaScript Dataverse, Dynamics 365, dynamics 365 crm javascript, editable grid, lock fields on editable grid, power apps, Power Automate, Power Platform

At times, you use Editable Grid and by default – all the fields which are editable by the system are exposed and can be edited if they are present on the Editable Sub-grid. You might not want to allow all fields to be editable on the Editable Grid – so here’s how you can lock selected fields on the Editable Grid using JavaScript.

Use Case

Let’s look at the below example where by default, the fields are Editable because you are using an Editable Grid –

You might want to lock the Status field since it shouldn’t be something end user should be able to change by themselves.
So in such scenarios, you might want to keep most fields open but lock some of them on the Editable Grid itself. Let’s see how we can do it using JavaScript

JavaScript Code

Here’s a sample code which you can use to loop through all the fields you want to lock on the Editable Grid –

Code within a class – [You can just use the lockFields function separately too.]

oSubscriptionCustomization = { lockFields: function (executionContext) { var oFormContext = executionContext.getFormContext(); if (oFormContext) { var arrFields = ["cft301_status"]; var objEntity = oFormContext.data.entity; objEntity.attributes.forEach(function (attribute, i) { if (arrFields.indexOf(attribute.getName()) > -1) { let attributeToDisable = attribute.controls.get(0); attributeToDisable.setDisabled(true); } }) } } };
In the above code, I’m reading from an array called arrFields and all the fields listed in the array will be looped through and locked.
Once my JS file is ready, I can open the Editable Grid control itself on the parent form and then loop for Events tab to register my function on the grid.
In the Event tab, look for the UI Event called as OnRecordSelect
Here, you can register your function. Since, I’m using class too – I’ll use classname.functionName
Once done, save and publish your changes. Now, you’ll see that the field is locked when you select the record on the Editable Grid.

Hope this was useful!

Here are some Power Automate posts you want to check out –

Thank you!

Adding Editable Grid using the New Power Apps Grid Control in Model-Driven Apps | [Preview]

December 11, 2022 priyeshwagh777 Microsoft PowerApps Dataverse, editable grid, model driven apps, power apps, power apps grid, powerapps

If you are designing your forms in the Model-Driven Apps designer from the Power Apps Maker i.e. https://make.powerapps.com/, here’s how you can add the New Power Apps Grid (which is in Preview at the time of writing this post)

Scenario

For example, you are in Model Driven Apps designer and you are see the existing Grids, they have only 2 areas in Properties –

Select the Grid and you’ll only see 2 areas –
And if you expand them, you won’t find a way to change the control to, for example, Editable Grid.
That’s where the new Power Apps Grid Control comes hand. This is currently in Preview at the time of writing this post.

New Power Apps Grid Control [Preview]

Now, click on the Components section to reveal all the Components that you could add to the Model-Driven Apps form –

You’ll see the More Components section under which you’ll find the new Power Apps Grid Control.
Now, once you drag is on the form where you want it to be, you’ll be asked to select the records it should hold. It’ll ask you to select the Table which you want to display in the sub-grid.
Once you click on Done, make sure the Show Related Records is selected as well and ensure the Table and View selected is correct.
Now, look for Components section and expand the same. Expanding the Components, you’ll be able to select the Editable Grid.
Expand the Components section and you’ll find another button to add more components that are made available.
Now, you’ll be able to select the Editable Grid here.
Now that you have added Editable Grid, click Done.
And once you add, you’ll notice that the Mobile, Web etc will be shown under the new grid. Means this is now set as default and not the other 2 views.
Finally, you can save your changes and publish.
And that’s how you are able to add Editable Grid on the modern Power Apps Model Apps designer using the new Power Apps Grid Component.
And here’s how you’ll be able to add an Editable Grid on the Form using new Power Apps maker.

Here’s the Microsoft Learn link for the same – https://learn.microsoft.com/en-us/power-apps/maker/model-driven-apps/the-power-apps-grid-control?WT.mc_id=DX-MVP-5003911

Hope this helps!

Here are some Power Automate posts you want to check out –

Thank you!

Use Read-Only grid among Editable Grid enabled entities in D365

March 5, 2019March 5, 2019 priyeshwagh777 Customizations, Dynamics 365, Dynamics 365 CE, dynamics 365 customization Dynamics 365, dynamics 365 customer engagement, editable grid

When you enable Editable Grid for an entity, all the public views become Editable Grids, correct?

And if you wonder if you can keep certain grids as Read-Only and the rest as Editable, your assumption is correct. Here’s what this blog is about.

You can still go back and select a particular grid which you want to keep as a classic Read-Only grid

Let’s say you have added the Editable Grid under Controls. This will apply Editable Grids for all the Views on that entity.
And you want Vendors view, for example, to show the classic Read-Only grid, open it up.
Select Custom Controls.
And force-add another Read only grid even if it says the Default one is already selected.
Save and Publish you changed and check
And the rest of the grids will continue to be Editable Grids