cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
JhonatanOB1993
Helper II
Helper II

Restrict date selection

Hello everyone.

I hope you are fine.

Please, can you help me with the following questions.

1. I have two DatePicker controls and I would like to restrict the second DatePicker, in which only the selection of a date greater than the date selected in the first DatePicker is allowed.
2. Is there a way to modify the default layout color that the DatePicker has (for now, I only see that it applies a color similar to blue).

Beforehand thank you very much.

Regards,

Jhonatan Ora Badillo
1 ACCEPTED SOLUTION

Accepted Solutions

Hi @JhonatanOB1993,

Do you want to make the end date later than the start date?

Could you please share a bit more about the scenario?

Set the OnSelect of the DatePicker as below:

If(
    DatePicker1.SelectedDate >= DatePicker2.SelectedDate,
    Notify(
        "Please select a date later than start date!",
        NotificationType.Error
    )
)

For the IconBackground property, it will be like as below:

v-qiaqi-msft_0-1622018083024.png

For the IconFill property, it will change the calendar icon color into Green, you could find the difference between it and the above screenshot.

v-qiaqi-msft_1-1622018239860.png

Regards,

Qi

 

 

Best Regards,
Qi

View solution in original post

3 REPLIES 3
rizkyaditya
Resolver III
Resolver III

Hello @JhonatanOB1993 ,

 

Let me assume your case like this:

 

1. I will name those two datepickers as :  firstDatePicker and secondDatePicker

 

2. For OnChange property of the secondDatePicker :

UpdateContext({varSecondDate: secondDatePicker.SelectedDate}); Reset(secondDatePicker)

 

3. For DefaultDate property of the secondDatePicker :

If(DateDiff(firstDatePicker.SelectedDate, varSecondDate, Days) <= 0, firstDatePicker.SelectedDate + 1, varSecondDate)

 

The secondDatePicker will always choose one day after the date in the first firstDatePicker, if the date difference  with secondDatePicker.SelectedDate less or equal than zero.

 

And for your second question, you may find what you need to modify here :

rizkyaditya_0-1621918109683.png

 

I hope this helps!

 

Hi @rizkyaditya.

 

First of all, thanks a lot for your reply.

 

I would like that when the user selects a date in the first date picker, the second date picker disables the ability to select a date less than or equal to the one chosen in the first date picker.

 

Is there any way to make that?

 

Regards,

 

Jhonatan Ora Badillo

Hi @JhonatanOB1993,

Do you want to make the end date later than the start date?

Could you please share a bit more about the scenario?

Set the OnSelect of the DatePicker as below:

If(
    DatePicker1.SelectedDate >= DatePicker2.SelectedDate,
    Notify(
        "Please select a date later than start date!",
        NotificationType.Error
    )
)

For the IconBackground property, it will be like as below:

v-qiaqi-msft_0-1622018083024.png

For the IconFill property, it will change the calendar icon color into Green, you could find the difference between it and the above screenshot.

v-qiaqi-msft_1-1622018239860.png

Regards,

Qi

 

 

Best Regards,
Qi

View solution in original post

Helpful resources

Announcements
PA User Group

Welcome to the User Group Public Preview

Check out new user group experience and if you are a leader please create your group

secondImage

Demo Extravaganza Winner Announcement

Please join us on Wednesday, July 21st at 8a PDT. We will be announcing the Winners of the Demo Extravaganza!

V3_PVA CAmpaign Carousel.png

Community Challenge - Giveaways!

Participate in the Power Virtual Agents Community Challenge

Carousel 2021 Release Wave 2 Plan 768x460.jpg

2021 Release Wave 2 Plan

Power Platform release plan for the 2021 release wave 2 describes all new features releasing from October 2021 through March 2022.

Top Solution Authors
Top Kudoed Authors
Users online (2,472)