This post is an extension of my previous posts. I suggest that you read Part 1 and Part 2 of this series to get a better understanding.

Furthermore, you can directly download the sample app for training and do this exercise as we go along.

Every time a field is updated, app will update the collection values in realtime. We have a lengthy code component that gets repeated inside the OnChange attribute in each field.

Now imagine having 20+ fields in the canvas app. Do we have to repeat the same OnChange code 20 times? Is there a better way to reuse the code in this scenario?

Well, here is another design approach.

1. When a field is being updated, it could trigger a simple action. i.e button click
2. This button will run the complex code inside OnSelect attribute

This way, we only have lengthy code in the button OnSelect attribute. No need to repeat the code in each field.

Let’s begin..

1. Add a button to your app (ChartTrigger)
2. Update the OnSelect attribute with the repeating code

3. Remove OnChange attribute values from all data fields. Save and publish.

4. Now, let’s test the button. Ideally, it shouldn’t update charts when you update field values. However, when you click the button, charts should update.

We have successfully created a chart generation action. Now all we need is to trigger this button whenever a field gets updated. Below are the steps:

5. Select the data field and select OnChange attribute. Update it with below code.

Select(ChartTrigger)

Every time a field is updated, this code will perform button click action. Now, repeat this for all required fields.

6. Update the Button > AutoDisableOnSelect to false.

7. Finally, hide the button by setting Button > Visible to false.

8. Save and publish the app.

All done, let’s test the app now..

Values are updating in realtime with the new trigger and reusable code.

Download the updated power app here. You can directly import it and start exploring the design.

Next time, we will discuss how we can export these charts into a printable format.

Happy Learning!

Categories: PowerApps

Tags: charts, collections, powerapps design, realtime