cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
Anonymous
Not applicable

Date picker: Disable past dates in forms

I have a form in a PowerPortal page with date picker fields.

I want to add validation to the date picker fields to disable past dates.

 

From my research, I have added some custom javascript code to the page and the form via portal management but it did not work for me.

 

My code:

 

 

 

 

 

 

$(document).ready(function() {
   $("#crdd8_trip1_departure_date")
   .next()
   .data("DateTimePicker")
   .setMinDate(moment());
});

 

 

 

 

 

 

 
Questions:
Is the above correct or is there a different code that should do this for me?
I have been inserting the code under the javascript section in the additional settings tab, is this the correct place?
 
Any suggestions will be appreciated.
1 ACCEPTED SOLUTION

Accepted Solutions

Hi  Chuxmbcn

 

I have achieved using below code

 

Step 1: Goto portal management

Step 2: Goto form 

Step 3: Additional settings

Step 4: custom Javascript(paste below code)

"dr_dateoccured"  instead of this field please paste your filed schema name.

 


// disable dates in the past
$("#dr_dateoccured").next().data("DateTimePicker").minDate(moment())
 
Output:
Using above code i am not able to select past date.
 
 
Please try above code,it will work.
 
Regards
Haritha
 

View solution in original post

11 REPLIES 11

Hi,

 

Please try below jQuery code,

Date_picker   instead paste your date field 

 

 

 

$(document).ready(function () { $("#date_picker").datepicker({ minDate: 0 }); });

 

Regards

Haritha

If answer is accepted means please make it as verifies 

Anonymous
Not applicable

Thanks for your response but that code did not work for me.

Fubar
Multi Super User
Multi Super User

Please provide more details:

  • If you open the date picker can a user pick a date that is in the past (from the picker)? or
  • are you meaning the user can manually enter a date that is in the past into the input field?

The following is correct for disabling the dates within the picker control (you have to do the Imput seperately if the input is enabled)

// depending on where you place this it may also be wrapped in a JQuery document ready
// and <script> tags
$("#your_fieldname").next().data("DateTimePicker").minDate(moment()); 

 

 

Anonymous
Not applicable

Thank you so much Fubar.

 

Yes users are able to pick a date that is in the past.

They are also able to type a date in the past.

 

Your code worked for me but they are still able to type a date in the past.

Is there a code that can stop that and also grey out dates from the past in the date picker.

Fubar
Multi Super User
Multi Super User

You will have to add code to pickup the on change (note: they use a custom event dp.change not a standard onchange)

// change of date field - will pick up both manually typed date and selection from datepiker control

var myDateControl = $("#your_fieldname").closest("div.control")[0];
$(myDateControl).on("dp.change",function(e){
    alert("The onchange event of datepicker is fired");    
});

 

Anonymous
Not applicable

Hi Fubar,

 

Thanks for your effort in helping me but the code is not working as expected.

What the code is doing is that it pops up the alert message both when past and future date is selected.

 

It just flags on any change made on the date field and after clicking okay, it still retains any data populated in the field.

 

Screenshots:

On selecting a future date:

Chuxmbcn_0-1678675813277.png

On selecting a past date:

Chuxmbcn_1-1678675892665.png

On clicking "OK", it populate the field with the already selected data:

Chuxmbcn_2-1678675977655.png

This is the same on manual data entry.

 

I think the best thing to do here will be to totally disable manual entry of data in a date field, any code while validating past dates on a date picker.

 

Any code for that will be highly appreicated.

 

Thanks,

 

Chux

 

Hi,

 

As i have achieved before ,on submit form it will not allow paste dates.it will allow only today and future date. If it is okay please try once.

 


$(document).ready(function() {
    //Create date  date validator
    var futuredatevalidation = document.createElement('span');
    //setup validator property and associated field
    futuredatevalidation.style.display = "none";
    futuredatevalidation.id = "dr_futuredatevalidation";
    futuredatevalidation.controltovalidate = "dr_date"; //datetime field
    futuredatevalidation.evaluationfunction = function() {
        var returnValue = true; //set default value as true
        //get   date done
        var date = $("#dr_date").val();
        //check if date is missing
        if (date == "101")
            returnValue = false; //if date is blank return false
        //format date using moment
date = moment(new Date(date), 'DD/MM/YYYY');
         //current date
         var currentDate = new Date();
         currentdate = moment(new Date(currentDate), 'DD/MM/YYYY');
        
        //get day from date
        //var daynumber = new Date( date).getDay();
        //validation for saturday and sunday
        if (date < currentdate ) {
            //setup custom validation message
            this.errormessage = "<a href='#dr_dateoftheprocedure_label'> Date  should  be greaterthan Current Date.</a>";
            returnValue = false;
        }
        return returnValue;
    };
    // Add the validator to the page validators array:
    Page_Validators.push(futuredatevalidation);
    // Wire up the click event handler of the validation summary link
    $("a[href='#dr_date_label']").on("click", function() {
        scrollToAndFocus('dr_date_label', 'dr_date');
    });
});

Hi  Chuxmbcn

 

I have achieved using below code

 

Step 1: Goto portal management

Step 2: Goto form 

Step 3: Additional settings

Step 4: custom Javascript(paste below code)

"dr_dateoccured"  instead of this field please paste your filed schema name.

 


// disable dates in the past
$("#dr_dateoccured").next().data("DateTimePicker").minDate(moment())
 
Output:
Using above code i am not able to select past date.
 
 
Please try above code,it will work.
 
Regards
Haritha
 

Helpful resources

Announcements

Summer of Solutions | Week 3 Results | Win free tickets to the Power Platform Conference

We are excited to announce the Summer of Solutions Challenge!    This challenge is kicking off on Monday, June 17th and will run for (4) weeks.  The challenge is open to all Power Platform (Power Apps, Power Automate, Copilot Studio & Power Pages) community members. We invite you to participate in a quest to provide solutions to as many questions as you can. Answers can be provided in all the communities.    Entry Period: This Challenge will consist of four weekly Entry Periods as follows (each an “Entry Period”)   - 12:00 a.m. PT on June 17, 2024 – 11:59 p.m. PT on June 23, 2024 - 12:00 a.m. PT on June 24, 2024 – 11:59 p.m. PT on June 30, 2024 - 12:00 a.m. PT on July 1, 2024 – 11:59 p.m. PT on July 7, 2024 - 12:00 a.m. PT on July 8, 2024 – 11:59 p.m. PT on July 14, 2024   Entries will be eligible for the Entry Period in which they are received and will not carryover to subsequent weekly entry periods.  You must enter into each weekly Entry Period separately.   How to Enter: We invite you to participate in a quest to provide "Accepted Solutions" to as many questions as you can. Answers can be provided in all the communities. Users must provide a solution which can be an “Accepted Solution” in the Forums in all of the communities and there are no limits to the number of “Accepted Solutions” that a member can provide for entries in this challenge, but each entry must be substantially unique and different.    Winner Selection and Prizes: At the end of each week, we will list the top ten (10) Community users which will consist of: 5 Community Members & 5 Super Users and they will advance to the final drawing. We will post each week in the News & Announcements the top 10 Solution providers.  At the end of the challenge, we will add all of the top 10 weekly names and enter them into a random drawing.  Then we will randomly select ten (10) winners (5 Community Members & 5 Super Users) from among all eligible entrants received across all weekly Entry Periods to receive the prize listed below. If a winner declines, we will draw again at random for the next winner.  A user will only be able to win once overall. If they are drawn multiple times, another user will be drawn at random.  Individuals will be contacted before the announcement with the opportunity to claim or deny the prize.  Once all of the winners have been notified, we will post in the News & Announcements of each community with the list of winners.   Each winner will receive one (1) Pass to the Power Platform Conference in Las Vegas, Sep. 18-20, 2024 ($1800 value). NOTE: Prize is for conference attendance only and any other costs such as airfare, lodging, transportation, and food are the sole responsibility of the winner. Tickets are not transferable to any other party or to next year’s event.   ** PLEASE SEE THE ATTACHED RULES for this CHALLENGE**   Week 1 Results: Congratulations to the Week 1 qualifiers, you are being entered in the random drawing that will take place at the end of the challenge. Week 1: Community MembersSolutionsSuper UsersSolutionsPower Pages @Inogic  1   @ragavanrajan  2 @aofosu  1 @Jcook  1Open  @OliverRodrigues  1Open  @Lucas001  1Open Open    Week 2 Results: Congratulations to the Week 2 qualifiers, you are being entered in the random drawing that will take place at the end of the challenge.   Week 2: Community MembersSolutionsSuper UsersSolutionsPower Pages @taraubianca25  2 @EmadBeshai  2 @ALP2  2@Fubar 2 @ekluth1  2@ragavanrajan 1 @mandela  1@OliverRodrigues 1 @Ajlan  1Open   @elishafxx  1    @TA_Jeremy  1    @helio1981  1       Week 3 Results: Congratulations to the Week 3 qualifiers, you are being entered in the random drawing that will take place at the end of the challenge. Week 3:Community MembersSolutionsSuper UsersSolutionsPower PagesInogic2@EmadBeshai 6Ajlan1@ragavanrajan 4CraigWarnholtz1@Fubar 4  @Jcook 3  @OliverRodrigues2  

Community will be READ ONLY July 16th, 5p PDT -July 22nd

Dear Community Members,   We'd like to let you know of an upcoming change to the community platform: starting July 16th, the platform will transition to a READ ONLY mode until July 22nd.   During this period, members will not be able to Kudo, Comment, or Reply to any posts.   On July 22nd, please be on the lookout for a message sent to the email address registered on your community profile. This email is crucial as it will contain your unique code and link to register for the new platform encompassing all of the communities.   What to Expect in the New Community: A more unified experience where all products, including Power Apps, Power Automate, Copilot Studio, and Power Pages, will be accessible from one community.Community Blogs that you can syndicate and link to for automatic updates. We appreciate your understanding and cooperation during this transition. Stay tuned for the exciting new features and a seamless community experience ahead!

Check Out | 2024 Release Wave 2 Plans for Microsoft Dynamics 365 and Microsoft Power Platform

  On July 16, 2024, we published the 2024 release wave 2 plans for Microsoft Dynamics 365 and Microsoft Power Platform. These plans are a compilation of the new capabilities planned to be released between October 2024 to March 2025. This release introduces a wealth of new features designed to enhance customer understanding and improve overall user experience, showcasing our dedication to driving digital transformation for our customers and partners.    The upcoming wave is centered around utilizing advanced AI and Microsoft Copilot technologies to enhance user productivity and streamline operations across diverse business applications. These enhancements include intelligent automation, AI-powered insights, and immersive user experiences that are designed to break down barriers between data, insights, and individuals. Watch a summary of the release highlights.    Discover the latest features that empower organizations to operate more efficiently and adaptively. From AI-driven sales insights and customer service enhancements to predictive analytics in supply chain management and autonomous financial processes, the new capabilities enable businesses to proactively address challenges and capitalize on opportunities.    

Updates to Transitions in the Power Platform Communities

We're embarking on a journey to enhance your experience by transitioning to a new community platform. Our team has been diligently working to create a fresh community site, leveraging the very Dynamics 365 and Power Platform tools our community advocates for.  We started this journey with transitioning Copilot Studio forums and blogs in June. The move marks the beginning of a new chapter, and we're eager for you to be a part of it. The rest of the Power Platform product sites will be moving over this summer.   Stay tuned for more updates as we get closer to the launch. We can't wait to welcome you to our new community space, designed with you in mind. Let's connect, learn, and grow together.   Here's to new beginnings and endless possibilities!   If you have any questions, observations or concerns throughout this process please go to https://aka.ms/PPCommSupport.   To stay up to date on the latest details of this migration and other important Community updates subscribe to our News and Announcements forums: Copilot Studio, Power Apps, Power Automate, Power Pages

Users online (4,956)