Show, edit, or add a record in a canvas app

In a canvas app, add and configure a Display form control to show all fields in a record, You can also add and configure an Edit form control to edit any field in a record, add a record, and save your changes back to a data source.

Prerequisites

  • Learn how to add and configure a control in PowerApps.

  • Download this Excel file, which contains sample data for this tutorial.

  • Upload the Excel file to a cloud-storage account, such as OneDrive for Business.

  • Create or open an app for phones, add a connection to the FlooringEstimates table in the Excel file.

    You can add a form to a tablet app, but it won't match this topic because the form will have three columns by default.

  • If you open an existing app, add a screen to it.

Add a form, and show data

  1. On a blank screen, add a Drop down control, and name it ChooseProduct.

    Note

    If you're not sure how to add a control, rename it, or set a property, see Add and configure controls.

  2. On the Properties tab of the right-hand pane, set Items to FlooringEstimates and Value to Name.

    Set the form's Items property

    The list shows names of flooring products from the data source.

  3. Add an Edit form control, move it below ChooseProduct, and then resize the form to cover most of the screen.

    Add a form

    Note

    This topic describes the Edit form control, but similar principles apply to the Display form control.

  4. Set the form's DataSource property to FlooringEstimates and its Item property to this formula:

    First(Filter(FlooringEstimates, Name=ChooseProduct.Selected.Value))

    This formula specifies that, after you finish configuring the form, it will show the record that the user selects in ChooseProduct.

  5. On the Properties tab of the right-hand pane, select Edit fields.

    Edit fields

  6. In the Fields pane, select Add field, select the check box for each field, and then select Add.

    Add fields

  7. Select the ellipsis (...) next to Add field, select Collapse all, and then drag Name to the top of the list.

    Move field

    The Edit form control reflects your change.

    Show form

Set the card type for a field

  1. In the Fields pane, expand the Price field by selecting its down arrow.

  2. Open the Control type list, and then select Edit slider.

    Edit slider

    In the form, the Price field shows a Slider control instead of a Text input control.

  3. (optional) Follow the same process to change the control for the Overview field to an Edit multi-line text control.

(Edit form only) Save changes

  1. Rename the form EditForm.

  2. Add a Button control, and set its OnSelect property to this formula:

    SubmitForm(EditForm)

  3. Press F5 to open Preview, change the name of a product, and then select the button that you created.

    The SubmitForm function saves your changes to the data source.

  4. (optional) Close Preview by pressing Esc (or by selecting the close icon in the upper-right corner).

Next steps

Learn more about working with forms and formulas.