Introduction:
- Can we perform CRUD operation from Portal, without using Entity Forms and Entity List?
- Can we design Editable Subgrid in Portal to Update the data directly in D365?
- Can we Pass Input/Output Parameters between Portal and Dynamics 365?
- Can we trigger Power Automate (replaced name of Microsoft Flow) directly from Portal?
- It can only run on Page Load.
- It cannot runs On-demand. Like on button click.
- Its sequence/order is always first on the page. Means, it always runs at the beginning of the page load. We cannot change it\’s running order. For Example: If I have to run the Fetch XML once my particular business logic is completed, then it is not possible.
For Example- If I have a requirement to provide Approval functionality on the portal, where a specific set of users can approve the requests directly from the portal, And, in CRM we need to perform some complex business logic as soon as request status gets changed to Approved based on the user who Approved the request from Portal.
In this requirement, we could use the Entity List Workflow Action configuration, which lets you allow to run an on-demand workflow directly on Entity List\’s records. However, it doesn\’t provide any options to pass some information/parameters to the workflow. Like in our requirement, we need to pass the logged-in user id/name to know who approved the request.
Hence, we cannot implement such requirements directly from Portal and we end up writing either Plugin or Custom code to achieve this.
In today\’s article, I am going to create a Custom HTML Table which will provide the following features:
- Retrieve the Dynamics 365 Entity\’s data and Bind it into the Custom HTML Table.
- Create, Update and Delete the record in Dynamics 365.
- Editable Grid Feature, to update the record directly in D365 (same like Dynamics 365)
- Pass Input/Output Parameters to Dynamics 365 using Power Automate.
- Run Fetch XML On-Demand (button click)
Components:
In today\’s article, we are going to use the following components
- Dynamics 365
- PowerApps Portal or Dynamics 365 Portal (of any type)
- Power Automate (Microsoft Flow)
- HTML/JavaScript/JQuery
The whole article revolves around these three components:
PowerApps Portal, Power Automate (Microsoft Flow) and Dynamics 365.
- Portal Pass the information in the form of input parameters (JSON) to Dynamics 365 via Power Automate.
- Dynamics 365 pass the information in the form Output Parameters (JSON) to Power Apps Portal via Power Automate
- Dynamics 365 Instance
- PowerApps Portal or Dynamics 365 Portal (of any type)
- Power Automate (Microsoft Flow)
- HTML/JavaScript/JQuery Knowledge
Through this step, we\’ll retrieve the data from Dynamics 365 Entity using Fetch XML and in a later stage will bind this data into a Custom HTML Table.
// Paste your Fetch XML downloaded from Advanced Find
In the highlighted JSON, All Bold texts are written after {{result. are the schema name of a CRM field. While the texts are written before the : (colon) are like variables, used to hold the field\’s value.
Open the Webpage (partial URL) in the browser, you should get the entity data in JSON format (as shown below:
Step (b) Provide Name of the Flow and Choose When an HTTP request is received as Trigger Point
Step (c) Click on Use sample payload to generate the schema. Paste your sample JSON and Click on Done. Make sure there is no white space or syntax mistake in your sample JSON
My Sample JSON:
{ \”lead\” : [{ \”Action\”:\”Create\”, \”RecordId\”:\”123123\”, \”Subject\”: \”powerappsportal\”, \”Firstname\”: \”Arpit\”, \”Lastname\”: \”Shrivastava\”, \”Email\”: \”arpit@gmail.com\”} ]}
In the above JSON,
- lead – is a kind of variable inside my JSON which holds the whole JSON string.
- Action – will hold the operation name like Create/Update/Delete, etc
- RecordId – will hold the guid of dynamics 365 records. We\’ll pass null value when we have to Create the record, while in case of Update and Delete, we need to pass the guid of the record
- Subject – hold subject of lead
- Firstname – hold first name of the lead
- Lastname – hold last name of the lead
- Email – hold email address of the lead
You just need to put some sample values (except the Bold ones) in the JSON when you paste it in the Sample JSON Payload screen (shown above). However, in your code (mentioned in Step 2), you need to pass the actual dynamic values in order to perform your business logic.
Step (d) Add Next Step and Select Initialize Variable (rename it as per your need). And provide values as shown below. To set the value:
- Click inside the Value input box, you\’ll see a small popup window next to it.
- Click on Expressions Tab inside the popup window.
- Paste – triggerOutputs()[\’headers\’][\’origin\’] inside Expressions and Click OK
![]() |
Open any Power Automate instance From Run History and You\’ll see the origin in HTTP Request Headers |
- You will see the origin value set in your Value input box
Step (e) Add Next Step and Select Initialize Variable (rename it as per your need). Provide a Name and set it\’s Type to String (as shown below). Keep its value blank as of now. We\’ll set it\’s value later.
Step (f) Add Next Step and Select Apply to each
- Click inside the box Select an output from the previous step, you\’ll see the same popup window next to the input box.
- Choose the name of your JSON. In my example, the name of JSON is lead. (As shown below) Hence, it\’s showing a lead in the popup window
- We have to add the Conditions inside Apply to each as per the below diagram.
- So let\’s get started and Add first Condition Step inside Apply to each Step. And add the following 2 conditions to it.
- Action equal to \’Create\’ and
- Origin contains \’ or \’
- If Condition is True.
- Add Dynamics 365 Action and Choose to Create a record step
- Add one more step just below the Create a new record step and Choose Set Variable in order to set the variable (that we have initialized in Step (e)) value to Guid of the created record.
![]() |
Open any Power Automate instance From Run History and You\’ll see the iteminternalid in Create a new record step |
- If Condition is False
- Add one more Condition Step and again add following 2 conditions
- Action equal to \’Update\’
- Origin contains \’ or \’
- If Condition is True (Request is for Update and originated from Portal)
- Add Dynamics 365 Action and Choose to Update a record step
- If Condition is False
- Add one more Condition Step and again add following 2 conditions
- Action equal to \’Delete\’
- Origin contains \’ or \’
- If Condition is True (Request is for Delete and originated from Portal)
- Add Dynamics 365 Action and Choose to Delete a record step
- A complete view of all the Conditions inside Apply to each step:
Step (g) Add Next Step outside Apply to each and Choose Response Step to capture HTTP Request Request. We don\’t need to read the response in case of Update and Delete. However, in the case of Create we need to return the Guid of created record as a response. Hence, we are using this step to Create operation only.
Complete View of Power Automate:
![]() |
Complete View |
![]() |
Explanation of each Step |
In this step, we\’ll design a Custom HTML Table and Bind the data retrieved from Fetch XML (Step 1)
Step (b) Open the Localized Content record from the Webpage and Paste the code in Copy HTML Section (as shown below)
Download the complete code from GIT Hub
Let\’s understand the code
This code does the following Tasks:
Page Load –
- It requests the Webpage URL (as a WEB API) which is associated with Web Template.
- Retrieve the response in JSON format (as per the JSON structure defined in Step 1)
- Parse the JSON.
- Bind the JSON data in Custom HTML Table
- Provides Update/Delete/Refresh options in each row.
- Creates an HTML Form to Create the record in Dynamics 365.
- Overall we are providing CRUD operation through Custom HTML Table
Create –
Following code, used to collect the information from Textbox Controls and Providing as Input Parameters to Power Automate in JSON format in order to create a record in Dynamics 365
//Get the record Guid as a Response from Power Automate
![]() |
Fill the form and Save the Information |
![]() |
The information has been Saved in Dynamics 365 and Showing in HTML Table
|
Update –
The following code used to Update the record in Dynamics 365 by providing the updated values as Input Parameters along with guid of the record to Power Automate in JSON format.
![]() |
Update the Lastname from \’Shrivastava\’ to \’Consultant\’ by Providing Editable Subgrid Feature |
![]() |
The information has been updated successfully |
Delete –
The following code used to Delete the record from Dynamics 365 by providing the Guid of record as an Input Parameter to Power Automate in JSON format.
![]() |
Deleting the Record from the Table |
![]() |
The record has been deleted successfully |
Refresh (Run Fetch XML on button click)–
Refresh the HTML table means, anytime we can refresh the table and can retrieve the updated data from Dynamics 365.
The code that we have written on-load of the page to retrieve the Lead data from Dynamics 365, can also be written on Refresh Button click as well so that we can the code on-demand as well.
So if you would have noticed that we are calling the Fetch XML as per our need and on button click that was one of the major limitations of using Fetch XML inside Web Template.
You can find the complete code of the Custom HTML Table and Editable Subgrid from my GIT HUB Repository
https://colinvermander.com/2017/04/17/dynamics-365-portals-use-liquid-to-return-json-or-xml/
- Don\’t copy the code from the article for the actual project\’s use as it may have some white spaces and special characters. You might end up facing unnecessary syntax issues if you do so. I have provided code in this article for understanding purposes only. If you want to get the actual code. Please download it from GIT HUB (given the links above).
- For demonstration, I have used Lead Entity, declared/initialized various variables and Input/Output parameters. And refer the same throughout the code and in Power Automate. Please make sure to change the code/variables/parameters based on your requirements
Git Hub repository is not accessible and throwing an error like 404 page not found.!
LikeLike
Not all the pictures are visible 😦 Is it also possible to make one button and update all the records listed in the list at once?
LikeLike
Your blogs further more each else volume is so entertaining further serviceable It appoints me befall retreat encore. I will instantly grab your rss feed to stay informed of any updates. convert $10
LikeLike
Excellent atricle. Really useful. thank you so much arpit. I appreciate you for your time and work.
LikeLike
Anyone looking for Salesforce app which save their time and can perform bulk CRUD operations in few click – their search end at Salesforce Appexchange app Bulk Object Field CreatorMost recommended and appreciable app by Salesforce MVP
LikeLike
Wow what a great post , its attract my mind i am thankful to you , i glad to be your regular user , keep sharing with us such leadpages popup## post.
LikeLike
Well Explained, Thanks!
LikeLike