How to create a Confirm Box in Canvas App Power Apps

A Confirm Box in Canvas Apps is an interactive feature that prompts users to confirm an action before proceeding. This ensures actions like deletions, updates, or submissions are deliberate, reducing the chances of errors. Since PowerApps doesn’t have a built-in confirm dialog, you can implement a custom solution using popups and logic controls.

Watch the video or scroll down to read the article.

Steps to Create a Custom Confirm Box

1. Design the Popup
   • Add a Rectangle for the background overlay.
     • Set the color to semi-transparent (e.g., RGBA(0, 0, 0, 0.5)) to create a dimmed effect.
     • Name it PopupBackground.
   • Add a Container to serve as the confirm box.
     • Set a border, padding, and a light background color for better visibility.
     • Name it ConfirmBoxContainer.
2. Add Text and Buttons
   • Inside the ConfirmBoxContainer:
     • Add a Label for the confirmation message. Set its Text property to something like “Are you sure you want to proceed?”
     • Add two Buttons:
       • Confirm Button: Label it “Yes”. Name it ConfirmButton.
       • Cancel Button: Label it “No”. Name it CancelButton.
3. Create a Variable for Visibility
   • Define a global variable to control the visibility of the confirm box:
     • Add the following formula to the OnStart property of the app. Set(ShowConfirmBox, false)
   • Set the Visible property of PopupBackground and ConfirmBoxContainer to ShowConfirmBox
4. Trigger the Confirm Box
   • Add a button or control to trigger the confirm box. For example, a “Delete” button.
   • Set the OnSelect property of this button to:Set(ShowConfirmBox, true)
5. Handle User Response
   • For the “Yes” button (ConfirmButton):
     • Add the desired action followed by closing the confirm box.
   • // Example action: Notify the user of confirmation Notify("Action confirmed!", NotificationType.Success); Set(ShowConfirmBox, false)
   • For the “No” button (CancelButton):
     • Simply close the confirm box: Set(ShowConfirmBox, false)
6. Optional Enhancements
   • Dynamic Messages: Use a variable to dynamically set the message text for the confirm box:Set(ConfirmMessage, "Are you sure you want to delete this record?"); Set(ShowConfirmBox, true); Bind the Text property of the label to ConfirmMessage
   • Animations: Add animations for showing and hiding the confirm box using the Transition or Timer controls.

Example Use Case: Deleting a Record

• Add a “Delete” button next to a gallery item.
• Set the OnSelect property of the button to:Set(ConfirmMessage, "Are you sure you want to delete this record?"); Set(ShowConfirmBox, true);
• In the “Yes” button of the confirm box:Remove(YourDataSource, ThisItem); Notify("Record deleted successfully.", NotificationType.Success); Set(ShowConfirmBox, false);

Hope it helps…