How to pass field values from a Canvas App to Power Automate(flow) - Part 1
Let's see a simple example. I have a canvas app that has multiple input fields.
Once user submits the form, we need to send a confirmation email to the user with all submitted information.
To do this, you need create a JSON object that contains all form values and pass it to Power Automate.
Creating FormInfo Json Object
First create a collection and add all inputs as string values.
For Button1 OnSelect query, we need to first create this collection.
Collect(
FormInfo,
{
lname: lastname_input.Text,
fname: firstname_input.Text,
email: email_input.Text,
account: account_input.Text,
dob: Text(DatePicker1.SelectedDate)
}
);
To further explain above step, I am creating five new variables (lname, fname, emil, account, dob) and assigning form input string values to them.
After that, we need to convert this collection to a JSON object.
Set(
FormObj,
JSON(FormInfo)
);
Now we can pass this new Object to Power Automate flow.
Before doing this, let's copy the full query for OnSelect into a text file.
Then select Action > Power Automate and "Create a new flow"
This will open flow designer in another tab
Select "Power Apps Button" as the template and let's start creating the flow.
Creating the Form Submit flow in power automate
Our main actions of the workflow would be:
a. Get FormObj JSON object from PowerApp - PowerApps trigger
b. Parse JSON - parse JSON action
c. Get the values and put them in an email - Send Email Action
Note - Any connection/action that we want to use in the flow should be added to the flow before saving the flow and adding to PowerApp. If you add any actions after it was added to PowerApp, it could give an error like this:
Flow Design Steps
a. Get FormObj from Power Apps - Select PowerApps Trigger
b. Add - "Parse JSON" action and Select "Body" as the content and "{}" as schema
c. Add "Send an email" action and use "Ask in PowerApps " as the body
d. Let's rename the flow to be more meaningful
e. Save
According to this flow, any value that is coming through power apps connector should get reflected in the email body. The reason we used a dummy JSON Parse action was to create that initial connection with PowerApp.
Remember : You will get errors if you start adding actions to the flow after you connect it to Power Apps. Therefore, you need to add all the connections/actions before adding the flow to your PowerApps button.
Passing the FormInfo object to flow
Once the flow is configured, save it and open the power app again. You will see the new flow under your power app.
Click on the flow and it will be added to the button. This will remove the existing OnSelect query.
Since we copied the query earlier to a text file, we can copy the query again from it and paste it in the button OnSelect query.
Along with that, we need to add below code to pass the JSON object to flow.
FormSubmit.Run(FormObj);
Here is the complete Query
Collect(
FormInfo,
{
lname: lastname_input.Text,
fname: firstname_input.Text,
email: email_input.Text,
account: account_input.Text,
dob: Text(DatePicker1.SelectedDate)
}
);
Set(
FormObj,
JSON(FormInfo)
);
FormSubmit.Run(FormObj);
Since we are adding all form submissions to collection, this array/collection will contain values since the beginning. Therefore, we need to clear the collection before each submission so that only current record will be saved in the collection and then transferred over to flow.
For this, we can add Clear(FormInfo); to the button OnSelect query.
Now let's test the application
You should now receive an email containing the power apps object
In my next post, we will see how to parse the JSON object in flow and get the field variable values so that we can append to any desired email format.
Comments
Post a Comment