Navigation, add, update & delete

Objective

Create a Power App that allows users to:

Navigate between screens.
Update existing records.
Delete records.
Refresh the data to reflect changes.

App Structure

We will create the following screens:

HomeScreen — Gallery view to list all records.
EditScreen — Form view to update selected records.

Data source used in this example: 'expense-items' (can be any table from SharePoint, Dataverse, or Excel)

1 Navigation Between Screens

A. Create Screens

1.From the left panel, click on Screens > New screen > Add:

HomeScreen
EditScreen

B. Home Screen

On HomeScreen, add a Gallery (Insert > Gallery > Vertical).
Set the Items property of the Gallery:
```
'expense-items'
```

Add filtering using a text input (txtSearch):

Filter(
    'expense-items',
    Email.Email = User().Email &&
    (IsBlank(TextInput.Text) || StartsWith(Text(Amount), TextInput.Text))
)

Filter(
    'expense-items',
    Email.Email = User().Email &&
    (IsBlank(TextInput1.Text) || Amount = Value(TextInput1.Text))
)

Set the OnSelect property of the Next arrow icon:

Navigate(EditScreen, ScreenTransition.Fade);
EditForm(ExpenseForm);

Set the OnSelect property of the Trash icon:
```
Remove(ExpenseForm);
```
Use the default Next arrow icon inside the gallery for navigation, and a trash icon to delete an expense.

C. Edit Screen

On EditScreen, insert an Edit Form (Insert > Forms > Edit).
Set its DataSource:
```
'expense-items'
```
Set its Item property:
```
Gallery1.Selected
```
Add a button below the form with this OnSelect:
```
SubmitForm(ExpenseForm)
```

After submitting, you can add this logic to navigate HomeScreen:

If(
    ExpenseForm.Valid,
    SubmitForm(ExpenseForm);
    Navigate(HomeScreen, ScreenTransition.Cover)
);

D. More Configuration in Home Screen

On the HomeScreen, click the Add Expense Button.

Set its OnSelect property:

Navigate(EditScreen, ScreenTransition.Fade);
NewForm(ExpenseForm);

Complete the form and click the submit button.

E. Add an Edit Form

Clicking the Next arrow icon in the HomeScreen gallery navigates to the EditScreen and shows the chosen item’s data in the form.

F. Add Delete Button to Gallery

On HomeScreen, add a trash icon to each item in the gallery.
Set the icon’s OnSelect:
```
Remove('expense-items', ThisItem)
```

Sometimes you want to manually refresh the data:

Add a Refresh button on any screen with:
```
Refresh('expense-items')
```

This ensures the latest data is pulled from the source.

Additional Tips

Auto Navigate After Delete:

If you delete from the EditScreen, use:

Remove('expense-items');
Navigate(HomeScreen, ScreenTransition.Cover)

SubmitForm Success Notification:

Use the form’s OnSuccess property:

Notify("Record updated successfully!", NotificationType.Success)

Summary

Suggested Enhancements

Add a Create screen (NewForm) for adding new records.
Use Patch() for complex updates.
Customize the form layout for better UX.