rwilson504 / PCFControls

Reusable PowerApps Control Framework (PCF) controls.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Model base calendar Date-Picker mode?

wendellsimmons opened this issue · comments

I have a use case where a subgrid embedded calendar is used as a "Date-Picker" by clicking on the displayed event entries which fires an OnSelect/OnClick event passing the event record's ID in the model app.

If this behavior is available in the canvas app version, I could embed the canvas app version, but how it might possible was not obvious to me.

Thx

Yes you can utilize the output parameters of the control in the canvas app. I have provided the ability to capture the click on an event as well as the click on empty area so that you could create a new event for that time span.

Below is an example of the two methods.

2021-04-16_9-14-36

In order to make it work you can utilize the OnChange event of the Calendar Control. Here is a screenshot of the event highlighting how to utilize the output parameters to set variables in your canvas app that will allow you to utilize the data.

image

//This provides the ability to act upon actions from the react components 
//such as a record being click on or an empty time slot being selected
If(
    CalendarControl.actionRecordSelected,
    Set(SelectedRecordID, CalendarControl.selectedRecordId);
    //Navigate(OpenExistingEvent);,
    Set(CloseRecordContainer, true);,    
    CalendarControl.actionSlotSelected,
    Set(SelectedSlotStart, CalendarControl.selectedSlotStart);
    Set(SelectedSlotEnd, CalendarControl.selectedSlotEnd);
    Navigate('New Event'); 
);

Wendell,

Looks like the image of your properties didn't come through, can you try sharing it again.

Thanks,

Rick

Wendell,

Sorry your images are still not coming through on the git comments. Here is what it looks like.

image

Also did you know you can now just copy/paste or drag an image directly into git comments. It will do an auto upload of the images. https://docs.github.com/en/github/managing-your-work-on-github/file-attachments-on-issues-and-pull-requests

Maybe third time is the charm..
screen
calendar

Third time was a charm! Ok so i think i got it figured out. This is happening because of a new Preview Feature called Explicit column selection. It was created so that apps would load faster by only returning the data it needs. Because the calendar control does not specify specific fields in the way a gallery does the data is not returned when this feature is turned on. Here are the options to fix it.

Option 1: Turn off the Explicit column selection. Go to the settings area of your app and turn it off. Make sure to save the app after you turn this off then close the app completely in the studio and re-open, otherwise you won't see the results of the change.

image

Options 2: When you build out your collection specify the columns you want using the ShowColumns function. The only problem with this solution is that currently when you use ShowColumns with a Collection and a CDS data source the collection will no longer be delegable, so only use this for smaller datasource.
image