Setting Up Calendar View for Lists | Power Pages

Calendar View Configuration for Lists in Power Pages

 
Unveiling the prowess of PowerApps portals leads us to a remarkable feature - the Calendar View for Lists. This transformative tool takes a mundane Table View and converts it into an organized, user-friendly calendar presentation. If you're itching to integrate this robust functionality, navigate to your website's portal management section. Once there, make your way to the 'Lists' tab nestled within the content category. Dive into the 'Calendar View' option within the Lists segment, and effortlessly activate the checkbox to enable this view.
 
However, there's an additional layer to this process. To create a truly seamless and tailored experience, ensure the correct fields are properly mapped. Here are the pivotal players:
 

1. Start Date Field 
2. End Date Field 
3. Summary Field 
4. Description Field 
5. Organizer Field 
6. Location Field 
7. Is All Day Field

 
Remember, the first trio (Start Date, End Date, and Summary) are indispensable fields. These must be present within your main entity. Take note, any identical columns in your related entity won't manifest in this configuration.

Step 1: Make sure you have the accurate data-model

I am going to be using OOTB Tasks Table for this tutorial as it already has all the required fields.

Step 2: Navigate to Poral Management (Model Driven)

Play the application

Step 3: Select "Lists" from the site navigation

Click on "+ New"

Step 4: 

After selecting your desired table and website, click on "+ View"

Select the view you want.

Step 5: 

Navigate to "Calendar View" tab and check the "Enable" checkbox, and map the desired fields as shown in the below picture:

Step 6: Scroll down and explore personalization settings:

Step 7: Save the View using the "Save" Button on the Ribbon.

Step 7: Edit your Portal in "Power Apps"

Navigate to Maker Portal > Apps > Your App

Click on More > Edit

Next you'll see this screen:

Select "Keep using Power Apps"

Step 8: Synchronize the changes

Click on "Sync Configurations" on the right top corner

Step 9: Add a Page

From the left top corner select + Page > Blank

Name this page "Calendar" or anything that suites you

Step 10: Add the View

Select the section of the screen where to want to add the calendar

Click on the "+" Icon on the left menu. 

Select "List"

Step 11: Configure the List

Check the "Use existing" radio button 

Select the "Calendar View" list that we just made in the "Name" dropdown.

Step 12:

Click on "Sync Configurations" on the right top corner

Click on "Browse" on the right top corner

Navigate to the New Page we added for Calendar View

Step 13:

Add some records and test the Calendar View

Note: Make sure to add "Table Permissions" of the specific table used in calendar view to view the records in portal

All set...

Elevate your Power Pages setup by adhering to these steps and configuring the Calendar View for Lists. Impressively, this empowers your audience to access information in a more organized manner and navigate through it effortlessly.
 
But there's an extra dimension to explore! Enhance your setup by personalizing the initial Calendar view to match your preferences - whether it's Yearly, Monthly, or Weekly. Not only that, you have the freedom to tailor the calendar's appearance, choosing between a Full Calendar display or an Event List style. This level of customization adds versatility to your Power Pages, ensuring that users engage with content in precisely the way they desire.
 
One important note to remember is that for any type of Lists view, be it View, Calendar, or Map, the List must be bound with one of your pages. Additionally, ensure that the page role and Entity table permissions are appropriately granted. This ensures a seamless and secure experience for both you and your users.