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

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.

2 Add an Edit Form in EditScreen

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)
);

3 Add New Records

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.

4 Update Records

A. 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.

5 Delete Records

A. 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)
```

6 Refresh Data

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 Table

Suggested Enhancements

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