Quantcast
Viewing all articles
Browse latest Browse all 386

Power Apps Portals: Adding Related Subgrids

This video demo and blog provide a step-by-step walkthrough of adding related subgrids to a Power Apps portal for a Trip Planner Application.

You may consider adding a related subgrid to your portal if you have tables associated with each other. For example, you have a Trip table that is your main table and a Traveler table. You want your traveler table to be directly related to your trip table so that any data you add to your traveler table for a specific trip will be added to that trip and not all.

The steps to achieving this include creating the relationship between tables, modifying the forms and views, adding the related subgrid to the main Trip form, and configuring the Portal Management App and portal designer.

I have created a Trip Planner application where Trip is the main table and Traveler is the related table in this walkthrough. By the end, we will have one Trip to many travelers and ensure the travelers for one Trip don’t get added to a different trip.

Image may be NSFW.
Clik here to view.
Traveler Subgrid Example

This example image is what the Traveler subgrid will look like inside the beach trip.

Steps:

  1. In your solution, create a Trip table with custom columns
  2. Create a Lodging Table
  3. Create a 1:M relationship between Trip and Travelers
    Image may be NSFW.
    Clik here to view.
    One to Many from Related table
  4. Customize the view for both Trip and Traveler
  5. Add a new Main form inside the Trip table
    1. Add custom columns by dragging or clicking it from the left panel
    2. Add a related subgrid in the same tab
      Image may be NSFW.
      Clik here to view.
      Component Layout
      Image may be NSFW.
      Clik here to view.
      New Trip Layout
    3. Save and Publish the form, Click Back
  6. Navigate to the Portal Management App
    1. Create 2 new Entity Forms
    2. One for “New Traveler”
    3. One for “Update Traveler”
      Image may be NSFW.
      Clik here to view.
      New Traveler Update
      Image may be NSFW.
      Clik here to view.
      Update Traveler Image Edit and Record Source Type
  7. Create a new entity form called “Update Main Form”
    Image may be NSFW.
    Clik here to view.
    Select New Entity Step
    1. Navigate to Entity Form Metadata tab, click New Entity Form Metadata
  8. Select Subgrid from Type
  9. Select the correct subgrid from the drop-down
  10. Select the New Traveler form for Create
  11. Select Update Traveler form for all other actions
    Image may be NSFW.
    Clik here to view.
    Update Traveler and Create Entity
  12. Create an Entity form called “New Main Form” and follow the same steps for the subgrid configuration but ensure the Mode is Insert in the General tab
  13. Your Entity Forms should look like this
    Image may be NSFW.
    Clik here to view.
    Active Entity Forms
  14. Navigate to Entity Lists inside the Portal Management App and create a new list called “Main List”
    Image may be NSFW.
    Clik here to view.
    Main Entity List
  15. Under the Options tab, Add Main Form to Grid ConfigurationImage may be NSFW.
    Clik here to view.
    Add Main List Entity to Configuration
  16. Navigate to the Portal Designer editor
    Image may be NSFW.
    Clik here to view.
    Navigate Trip Planner portal
  17. Add a List from Components
    Image may be NSFW.
    Clik here to view.
    Add list from components
  18. Select Use Existing, since we already created an Entity List in the Portal Management app
    1. Select Main List
      Image may be NSFW.
      Clik here to view.
      Update existing list

  19. Click Sync Configuration, then Browse Website
  20. You’ll see your Trip view and you’ll be able to Create New or Update an existing Trip
  21. Notice your related Traveler subgrid is added to both forms for editing
    Image may be NSFW.
    Clik here to view.
    Related Traveler Subgrid for editing 1

    Image may be NSFW.
    Clik here to view.
    Viewing Trip Details

As you can see, adding a related subgrid to your Power Apps Portal can be done out of the box with no code needed! The purpose of this is to be able to link multiple tables to each other and have them displayed in Power Apps Portals. Feel free to follow along using my instructional video for more detailed instructions.

The post Power Apps Portals: Adding Related Subgrids appeared first on Applied Information Sciences.


Viewing all articles
Browse latest Browse all 386

Trending Articles