Using PCF Custom Control Builder (XrmToolBox Plugin) to update existing control in Dynamics 365 / PowerApps


A couple of months back I had written my first PCF Control to display GUID of the record, it was more of a hello world kind of thing.

https://pcf.gallery/guid-control/

Well, the code was using Xrm.Page client API which as we know is deprecated.

So, it was time to update it to use context instead.

More on context

So, thought of using the wonderful PCF Custom Control Builder tool to do that by Danish (which got a new update today – 22- Oct-2019)

Connect to the organization, select Edit existing PCF Control option

Specify the Control Location and VS Command Prompt Location (VsDevCmd.bat)

And click on Reload Details which will list down the details of the component and the solution as shown above.

Click on Open in VS Code to open the project in Visual Studio Code and start making the required update.

It opens the project in Visual Studio Code.

i.e.

Here let us update the index.ts file to use context to fetch the GUID.

Save the changes. And click on Build

i.e.

Now click on Test to see it in action or to debug.

We can see it populating the GUID

To debug it à we can use the developer tools (F12) and put the breakpoint in the index.ts file.

Now let us deploy it to our organization

Deployment in action

After successful deployment, we can see the solution added to our organization

Now let us use it for the single line of the text control.

Publish the changes.

Create the new lead record and we can see the GUID of the record created in the control

Thus, the wonderful PCF Custom Control Builder plugin of XrmToolBox makes it so easy to update the existing PCF Control and also to create new PCF Control.

Hope it helps..

Author: Nishant Rana

I love working in and sharing everything about Microsoft.NET technology !

3 thoughts on “Using PCF Custom Control Builder (XrmToolBox Plugin) to update existing control in Dynamics 365 / PowerApps”

Please share your thoughts

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.