Month Picker in Power Apps

-

For the enabling month picker in PowerApps. There is no direct option in Powerapps. We need to do a workaround procedure for a month picker.


This month Picker is a custom build.

With the help of SharePoint List, we can get the month picker working,







Proceed with the following steps 

Step 1: Create a Sharepoint list with the columns month in Letters and in numerics.

Refer to the following pic:


Sharpoint List

Create a new list in a SharePoint 

with column title and number 

with single line text data type






Step 2:Inside a power app Create a gallery with the data source as the month picker SharePoint List

Step3: Wrap the gallery with 3 columns and adjust the rows as per the requirement

NOTE: Create a gallery with a Vertical view and with a wrap count of 3.

Adjust the gallery as per your requirement 

Add the List that you created the month picker in the data source of the gallery.

Inside the ITEMS dialog box use the following formula.

SortByColumns(Month_Picker,"ID",Ascending)                 



To display the values inside the gallery use button instead of a label.

On the button, text use the  ( ThisItem.Title ) formula.







You will get the custom build gallery as a month picker, Now you can add the date-time function and navigate between the months.

Step 4: On App Start -

Add the following functions, 

 Set(currentyear,Year(Now()));

Set(currentmonth,Text(Now(),"[$-en-US]mmm"));

Set(showmonth,Text(Now(),"[$-en-US]mmm"));

Step 5: On select of the gallery buttons add the logics to get the start and end day of the selected month

Set(Monthinletter,ThisItem.Title);

Set(monthpic,ThisItem.Title);

Set(Datefrom,"01/"&ThisItem.Number&"/"&currentyear);

Set(DateTo,"30/"&ThisItem.Number&"/"&currentyear) 

in the button use these function to display the get the start date and end date of the month.

Step 6: Insert a '< ' and '>' icon and add the year functions like the following

Set(currentyear,currentyear-1);    in '<' icon of onSelect  and

If(currentyear=Year(Now()),"Future year cannot be selected") in  '>'  icon of onSelect. to avoid selcting future dates

Step 7: Using the label function display the set dates (  monthpic, Datefrom, DateTo  ) in the labels

Refer to the following pic in the final stage









And by this method, we can get the month picker in power apps.

Comments

Post a Comment

Popular posts from this blog

Adding Attachmnet to Calendar Event (Microsoft Graph API)

-
Image
            From the given documentation we cannot Attach a document while creating an event Follow the steps to add an Attachment in a Calender event through MS Flows: Step 1:Refer the Create event documentation graph API Step 2: From the create event get the event id, to use in the attachment API Sept 3: As per the document give all the required details from the URL and body of the flow Step 4: After processing the Attachment API, Update the event . Step 5: Once updated your will reacive a mail with attachment.
Read more

Adding Members in Yammer community using MS flows

-
Image
Here we will know how to add members to a yammer group using ms flows. Please following the following steps: Step 1:  We need to register the yammer application .               Follow the steps from the link and get the Bearer token from it.                  Generate the Token from it.                     Step 2: Create a blank ms flow with a button trigger. Step3: Initialize a String and add the following content into the string variable.         "  https://www.yammer.com/api/v1/group_memberships.json?group_id={Yammer group id}&email={O365 Email id}" Note: Yammer group id will be in form of integer eg; 6*********6 Step 4: Add an HTTP Action next to it and do the following. Step 5: Now trigger the flow you will get members added into the yammer community. 
Read more

Create a Yammer Group though MS flows

-
Image
 To Create a Yammer Group using MS flows. Proceed with the following steps: Step1: Register a Yammer Group  follow the registration process. Step2: After Registration, Generate the bearer Token id,   Integration                                                                                                                                                                                                  ...
Read more