How to Patch Power Apps Date Picker

In this Power Apps tutorial, we’ll look at a few examples of how to patch the Power Apps date picker.

While working with Power Apps, I got a requirement to patch the Power Apps date picker control to the SharePoint list.

Also, I will show you how to patch the Power Apps date picker control with the below things:

  • Introduction to Power Apps patch function
  • How to patch a Power Apps date picker control to SharePoint?
  • How to patch an existing date using Power Apps date picker?
  • How to patch today’s date from the Power Apps date picker?
  • How to patch a blank date from the Power Apps date picker?
  • Is it possible to patch a Power Apps date picker without OK?
  • How to patch a Power Apps date picker to excel?
  • How to patch a Power Apps date picker with am pm?
  • How do patch multiple Power Apps date picker control?

When working with Power Apps canvas apps, we may need to add a date picker control to a SharePoint list, Excel sheet, or other sources. Whether the date picker controls are single or multiple.

Introduction to Power Apps patch function

In Power Apps, there is an important function named Patch() which is used to modify single or multiple records in a data source. PowerApps Patch, on the other hand, is used to update records in a data source without impacting other assets.

Now, we’ll use Patch() functions along with the Power Apps date picker control to update and create new items within the data source.

We discussed how to use the patch function within the Power Apps gallery in our previous article.

Keep reading this tutorial to get ideas on how to patch a Power apps date picker based on some real-time examples.

Also Read: How to Reset Power Apps Date Picker

Power Apps date picker patch SharePoint

Here, we will see how to patch a Power Apps date picker control to a SharePoint list. That means we will build a canvas app having some fields associated with a specific SharePoint list and a button control to patch those fields to the SharePoint list.

To work with this scenario, the following steps are:

  • We have created a SharePoint list named “Projects” having a title and a date column shown below:
PowerApps date picker patch sharepoint
PowerApps date picker patch SharePoint
  • Add a text input control and a date picker control to the Power Apps blank screen to insert the project title and start date, respectively.
PowerApps date picker patch to the sharepoint
PowerApps date picker patch to the SharePoint
  • On that screen, add a button control and rename it as Save.
  • Insert the below expression on the button’s OnSelect property to patch the items from the Power Apps to the SharePoint list.
OnSelect = Patch(Projects,Defaults(Projects),{Title:Title_Txt.Text, StartDate: StartDate_DatePicker.SelectedDate});
Patch a SharePoint Date Column from Power Apps date picker
Patch a SharePoint Date Column from Power Apps date picker

Let’s save and preview the app. Insert data in both control and click on the save button.

Patching the Sharepoint date from Power Apps datepicker
Patching the Sharepoint date from the Power Apps date picker

We can see a new item along with the date has been created within the specified SharePoint list shown below:

Power Apps DatePicker Patch the SharePoint list
Power Apps DatePicker Patch the SharePoint list

This is how to patch a Power Apps date picker control to the SharePoint list.

Check out: Power Apps Checkbox control within Gallery

How to patch an existing date using Power Apps date picker?

Here, we will see how to update an existing date within the Power Apps list using the Power Apps date picker control. To modify or update a specific existing item, we will use Patch().

Let’s take the above example to implement this requirement. Suppose, we want to update the StartDate from 11/11/2022 to a selected date.

For this, we need to insert the below expression on the button’s OnSelect property. As a result, when we click on the button, the selected date will patch from the Power Apps date picker control to SharePoint.

OnSelect = Patch(
    Projects,
    LookUp(Projects, ID=68),
    {
        StartDate: StartDate_DatePicker.SelectedDate 
    }
)

Where,

  1. Projects: The name of the SharePoint data source
  2. ID=68: The id value of the specified item which will be modified
  3. StartDate: The name of the SharePoint date column
  4. StartDate_DatePicker: The name of the date picker control
Patch an existing date using Power Apps date picker
Patch an existing date using Power Apps date picker

Now, preview the app and select a date as per the requirement (ex- 11/25/2022). Then click on the save button.

PowerApps date picker Patch an existing date
PowerApps date picker Patch an existing date

We can see that the start date of the item will be changed to the selected date shown below:

Power Apps date picker Patch an existing date
Power Apps date picker Patch an existing date

This is how to patch an existing date using the Power Apps date picker inside SharePoint.

Have a look: How to use Power Apps Check Box Control

Power Apps date picker patch today’s date

In this section, we will see how to patch today’s date from the Power Apps date picker control.

That is, when the user enters data and clicks the button, the data is saved in the SharePoint list along with the current date. Even if the user selects a different date, the date will be saved as the current date.

To work with this scenario, we are going to use the above example of the SharePoint list (i.e., Projects) as well as the canvas app and the following steps are:

Power Apps date picker patch today's date
Power Apps date picker patch today’s date

On the above screen, the Power Apps date picker displays today’s date as default. To patch today’s date from the Power Apps date picker control, insert the below expression on the OnSelect property of the Save Button.

OnSelect = Patch(Projects,Defaults(Projects),{Title:Title_Txt.Text, StartDate: Today()});

Where,

  1. Title, StartDate: The name of the SharePoint column.
  2. Title_Txt: The name of the text input control name.
PowerApps date picker patch today's date
PowerApps date picker patch today’s date

Let’s preview the app and insert the data on the text input and date picker control.

PowerApps date picker control patch today's date
PowerApps date picker control patch today’s date

On the above screen, I entered the date 11/11/2022 as the start date, but as we can see, once I click the button, it will patch the current date within the SharePoint list.

How to patch today's date from the Power Apps date picker
How to patch today’s date from the Power Apps date picker

This is how to patch today’s date from the Power Apps date picker control to SharePoint.

Read out: How To Set Default Value in Power Apps List Box Control

Power Apps date picker patch blank date

Similarly, here, we will see how to patch a blank date from the Power Apps date picker control to SharePoint. Let’s take the above example to implement this requirement where the date picker is displaying today’s date as default.

Power Apps date picker patch blank date
Power Apps date picker patch blank date
  • As we want to patch the blank date from the Power Apps date picker to SharePoint list, insert the below expression on the button’s OnSelect property.
OnSelect = Patch(Projects,Defaults(Projects),{Title: Title_Txt.Text, StartDate: Blank()});
Power Apps date picker patch a blank date to data source
Power Apps date picker patch a blank date to data source

Let’s preview the app and insert the data in both controls. While clicking on the Save button, we can see instead of the selected date, it will patch a blank value from the Power Apps to date source.

PowerApps date picker patch blank date
PowerApps date picker patch blank date

This is how to patch a blank date from the Power Apps date picker to the data source.

Also Check: How to use Power Apps List box control?

Is it possible to patch a Power Apps date picker without OK?

Sometimes, we might wonder how to patch a Power Apps date picker without the OK button. That is, instead of clicking OK, we want to patch the date directly after it is selected.

Power Apps date picker patch without OK
Power Apps date picker patch without OK

Unfortunately, this feature is not available in Power Apps’ date picker control. We recommend you to click on the mentioned link to get more ideas about Power Apps date picker patch date without an OK.

Power Apps date picker patch multiple

In this section, we will see how to patch multiple dates from the Power Apps date picker controls.

Suppose, we have another date-type column inside the above SharePoint list i.e., Projects.

Power Apps date picker patch multiple
Power Apps date picker patch multiple
  • Let’s add another date picker control to the app like the below:
Power Apps date picker patch multiple dates
Power Apps date picker patch multiple dates
  • On the button’s OnSelect property insert the below expression to patch the multiple dates from the Power Apps to the SharePoint list.
OnSelect = Patch(Projects,Defaults(Projects), {Title: Title_Txt.Text, StartDate: StartDate_DatePicker.SelectedDate, DeliveryDate: DeliveryDate_DatePicker.SelectedDate});
Power Apps Date picker to patch several dates in one click
Power Apps Date picker to patch several dates in one click

That’s it! Now, preview the app and fill in all the above controls. Click on the Save button.

Patch Multiple date pickers from PowerApps into SharePoint List
Patch Multiple date pickers from PowerApps into SharePoint List

We can see that the multiple date pickers got patched to the SharePoint list from the Power Apps just after the button was clicked.

Power Apps date picker patch multiple dates to SharePoint
Power Apps date picker patch multiple dates to SharePoint

This is how to patch multiple dates from the Power Apps date picker controls to the SharePoint list.

Read: Power Apps combo box default value

How to patch a Power Apps date picker to Excel

Here, we will see how to patch a selected date from the Power Apps date picker control to Excel.

That means we will create a canvas app using the Excel data source and add a button control to that app. So that when the user clicks on the button, it will save that inserted data including the selected date from the Power Apps to Excel.

To work with this scenario, the following steps are:

  • We have prepared an excel sheet and converted that sheet to a table format named ProductTable has two General columns and a Date column shown below:
Power Apps date picker patch excel
Power Apps date picker patch excel
  • Connect this excel table to the Power Apps. On the Power Apps screen, add two text input controls to insert the product’s invoice and name respectively.
  • Similarly, add a Power Apps date picker control to insert the selected date and a button control to patch the date from the Power Apps to Excel.
PowerApps date picker patch excel
PowerApps date picker patch excel
  • To patch the data including the date, insert the below expression on the button’s OnSelect property.
OnSelect = Patch(ProductTable, Defaults(ProductTable), {ProductInvoice: 'ProductInvoice.Txt'.Text, ProductName: 'ProductName.Txt'.Text, PurchaseDate: PurchaseDate_DatePicker.SelectedDate})
Patch Power Apps Date Picker to Excel
Patch Power Apps Date Picker to Excel

Preview the app. Fill in the above controls and click on the button. (Suppose the selected date is 11/15/2022).

However, as we can see in the Excel below, the selected date will be patched and displayed as one day off:

Patch Power Apps Date picker selected date displayed is one day off in excel
Patch Power Apps Date picker selected date displayed is one day off in excel

The reason is when we load the date value from our Excel table into our Canvas app, the date value is identified as a UTC time value, and the corresponding local time value is displayed in your app against this UTC time value.

  • It might create an issue while inserting date values from the Power Apps into Excel. To fix this, select the Power Apps date picker control and set the DateTimeZone to UTC.
  • Insert the below expression on the button’s OnSelect property to patch the data.
OnSelect = Patch(ProductTable,Defaults(ProductTable), {ProductInvoice: 'ProductInvoice.Txt'.Text, ProductName:'ProductName.Txt'.Text, PurchaseDate: DateValue(Text(PurchaseDate_DatePicker.SelectedDate, DateTimeFormat.UTC))+1})

Where,

  1. ProductTable: The name of the Excel table
  2. ProductInvoice, ProductName, PurchaseDate: The header of the Excel table
  3. ProductInvoice.Txt, ProductName.Txt: The name of the text input controls for both inserting the product’s invoice and name.
  4. PurchaseDate_DatePicker: The name of the Power Apps date picker control.
Patch Power Apps Date Picker Value in Excel
Patch Power Apps Date Picker Value in Excel

Let’s preview this and insert the data, then click on the Submit button.

Power Apps Date picker value stored with one day less in database table
Power Apps Date picker value stored with one day less in database table

The exact date will be patched from the Power Apps date picker to Excel as shown below:

Power Apps patch Date picker date displayed is one day off in excel
Power Apps patch Date picker date displayed is one day off in excel

This is how to patch Power Apps date picker date vale to excel.

Also, have a look: How to Patch Power Apps Combo Box

How to patch a Power Apps date picker with am pm

We received a request from our client while working with the Power Apps canvas app. According to their specifications, when a user selects a date and time, the exact selected date and time will be patched from the Power Apps to the data source. That is, if the user enters the time as 18.36, the data source will display the time as 6.36 PM.

So in this section, we will see how to patch a Power Apps date picker with am pm. To work with this need, we are going to use the above SharePoint list named Projects.

Power Apps date picker patch am pm
Power Apps date picker patch am pm
  • Let’s create an edit form using the above SharePoint list and add a button to the app shown below:
PowerApps date picker patch am pm
PowerApps date picker patch am pm
  • Set the DateTimeZone as UTC in the above PowerApps date picker control.
  • Insert the below expression on the button’s OnSelect property to patch the data from the Power Apps to the data source.
OnSelect = Patch(Projects, Defaults(Projects), {Title: DataCardValue15.Text,  StartDate: DateValue1.SelectedDate + Time(Value(HourValue1.Selected.Value), Value(MinuteValue1.Selected.Value),0)})

Where,

  1. Projects: The name of the SharePoint data source
  2. Title, StartDate: The name of the SharePoint list column
  3. DateValue1: The name of the date picker control within the edit form
  4. HourValue1: The name of the dropdown control containing the hour values within the edit form
  5. MinuteValue1: The name of the dropdown control containing the minute values inside the edit form
How to patch date picker with time in PowerApps to data source
How to patch date picker with time in PowerApps to data source

Note: Make sure to keep both the Power Apps and SharePoint time zone as same. In our case, we set it as UTC.

That’s it! Let’s preview the app. Fill in the data into the Power Apps including the date time values. (Ex- 11/11/2022 16:43), and click on the button.

We can see the date value got patched with am pm in the data source like below:

Patch Power Apps date picker with am pm
Patch Power Apps date picker with am pm

This is how to patch Power Apps date picker with am pm.

Conclusion

From this Power Apps Tutorial, we learned how to patch the Power Apps date picker control into the data sources. Also, we covered below topics such as:

  • Introduction to Power Apps patch
  • Power Apps date picker patch SharePoint
  • Power Apps date picker patch without OK
  • Power Apps date picker patch existing SharePoint date
  • Power Apps date picker patch today’s date
  • Power Apps date picker patch multiple
  • Power Apps date picker patch blank date
  • Power Apps date picker patch excel
  • Power Apps date picker patch am pm

Furthermore, you may like some more Power Apps tutorials:

  • Hello,
    You’ve put a note:
    “Note: Make sure to keep both the Power Apps and SharePoint time zone as same.”
    But it’s not explained how to do it. Could you please explain?

  • >