cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
Advocate V
Advocate V

DatePicker Change Date Programmatically

Hello,

 

I have 2 buttons (next and previous) and a datepicker control.

The datepicker is defaulted to today. 

 

I want te be able to jump to the datepickers next day by clicking next and vice versa.
How do I do this?

1 ACCEPTED SOLUTION

Accepted Solutions
Power Apps
Power Apps

You can use a global variable to store the date that is bound to the Default property in the date picker, and in the prev/next buttons you'd decrement/increment the variable value.


In the app's OnStart property (you can find it on the first screen of your app), you'd need to initialize that value:

<first screen>.OnStart: Set(defaultDate, Today())

Now you can add the two buttons (prev/next) and set their properties to update the value of that property:

Button1.Text: "Previous day"
Button1.OnSelect: Set(defaultDate, DateAdd(defaultDate, -1, Days))
Button2.Text: "Next day"
Button2.Text: Set(defaultDate, DateAdd(defaultDate, 1, Days))

In the date picker, you then set its Default property to the "defaultDate" variable, so that when that property is changed (by clicking the previous/next buttons), then the date displayed in the picker will be changed as well.

DatePicker1.DefaultDate: defaultDate

The last thing you need to do is to update the "defaultDate" variable when the user selects a new date in the picker's calendar (so that the variable reflects what the date picker is showing, and incrementing / decrementing the date will produce the correct result):

DatePicker1.OnChange: Set(defaultDate, DatePicker1.SelectedDate)

Hope this helps!

View solution in original post

2 REPLIES 2
Power Apps
Power Apps

You can use a global variable to store the date that is bound to the Default property in the date picker, and in the prev/next buttons you'd decrement/increment the variable value.


In the app's OnStart property (you can find it on the first screen of your app), you'd need to initialize that value:

<first screen>.OnStart: Set(defaultDate, Today())

Now you can add the two buttons (prev/next) and set their properties to update the value of that property:

Button1.Text: "Previous day"
Button1.OnSelect: Set(defaultDate, DateAdd(defaultDate, -1, Days))
Button2.Text: "Next day"
Button2.Text: Set(defaultDate, DateAdd(defaultDate, 1, Days))

In the date picker, you then set its Default property to the "defaultDate" variable, so that when that property is changed (by clicking the previous/next buttons), then the date displayed in the picker will be changed as well.

DatePicker1.DefaultDate: defaultDate

The last thing you need to do is to update the "defaultDate" variable when the user selects a new date in the picker's calendar (so that the variable reflects what the date picker is showing, and incrementing / decrementing the date will produce the correct result):

DatePicker1.OnChange: Set(defaultDate, DatePicker1.SelectedDate)

Hope this helps!

View solution in original post

Works like a charm, it was a bit buggy at first but a clean restart fixed all settings!

Thanks a lot for the quick and helpful response!

Helpful resources

Announcements
Community Conference

Power Platform Community Conference

Check out the on demand sessions that are available now!

News & Announcements

Community Blog

Stay up tp date on the latest blogs and activities in the community News & Announcements.

secondImage

Power Platform 2020 release wave 2 plan

Features releasing from October 2020 through March 2021

Community Highlights

Community Highlights

Check out the Power Platform Community Highlights

Top Solution Authors
Top Kudoed Authors
Users online (9,562)