Low to Pro: Mastering Power Apps OnSave Behavior with JavaScript & Custom Code

In this episode of Low to Pro, Ace Phillips dives into the intricacies of customizing the OnSave behavior in Power Apps using JavaScript. This tutorial is designed for developers looking to enhance their model-driven apps by controlling how data is processed and saved within Dataverse.

🔍 Why Customize OnSave Behavior?

Ace presents a common scenario: entering contractor data into Dataverse, where a field must concatenate first name, last name, and contract number. While Power Automate flows could handle this post-save, Ace demonstrates how to prefill and manipulate this data using JavaScript before the record is saved.

🛠️ Setting Up the OnSave Event

• Navigate to the form and configure an OnSave event handler.
• Choose between PreSave (before data is committed) and PostSave (after data is saved).
• PreSave is ideal for modifying fields before triggering flows that monitor changes.
• PostSave is useful for actions like navigation after saving.

📁 Using Custom JavaScript Libraries

Ace introduces a custom JavaScript file containing a function pw.lowToPro.checkSaveType that determines the save type and executes logic accordingly.

💡 Save Types Explained

• 1: Save only
• 2: Save and close
• Other types include deactivate, reactivate, etc., each with unique codes.

🧪 Testing the Behavior

After setting up the handler and publishing the form, Ace demonstrates how to test both save types. He explains the concept of "dirty records"—changes not yet saved to the database—and how they trigger the OnSave logic.

🔁 Adding Multiple Event Handlers

Multiple handlers can be added to the OnSave event. They execute in order, allowing developers to chain behaviors like checking save type and then navigating to another page.

⚠️ Common Pitfalls

• Using PostSave logic in the OnSave event can cause errors due to unavailable properties.
• Best practice: place PostSave logic in the OnLoad event to ensure proper execution.

🧩 Implementing OnLoad Logic

In the OnLoad script, Ace checks if the form is new and conditionally adds the OnSave behavior. Regardless of form type, the PostSave logic is always executed after saving.

🧰 Custom Function: setValueOnSave

This function dynamically sets a field value by joining multiple fields with a specified separator. Parameters include:

• Execution context
• Field to set (e.g., contractor name)
• Join by (e.g., " - ")
• Fields to join (e.g., first name, last name, contract number)

📌 Final Thoughts

Ace wraps up by encouraging viewers to explore more about the Client API and event handling in Power Apps. He invites users to connect via https://pragmaticworks.com for mentoring or to explore additional training resources like the "Learn with the Nerds" series.

Don't forget to check out the Pragmatic Works' on-demand learning platform for more insightful content and training sessions on Power Apps and other Microsoft applications. Be sure to subscribe to the Pragmatic Works YouTube channel to stay up-to-date on the latest tips and tricks.