Date Picker elements with limits

  • James_Capurso
    Asked on April 23, 2024 at 5:31 PM

    Hi Team,

    I hope you are doing well!

    I'm trying to work out a way to improve my current JotForm (https://form.jotform.com/240807086250857)

    I'm trying to set this up with conditions to reflect the following

    • Start Date must be 7 days from today (to disable anything prior to today)
    • End date must be 7 days from start date (to disable anything prior to start date + 7 days)

    I'm just wondering how I do this as I've been playing around with conditions and I can't quite work it out!

    Please help!

    James


  • Kelvin JotForm Support
    Replied on April 23, 2024 at 8:36 PM

    Hi James,

    Thanks for reaching out to Jotform Support. If I understood what you’re asking, the Start Date is 7 days from today and any day prior is disabled, and the End Date needs to be at least 7 days from the selected Start Date and any day prior is disabled. When I checked your form, I see you that you've added the Start Date and End Date Date Picker elements, and Conditional Logic rules. In your case, you may not need conditions. I see you have the Start Date field with Limits as today+7. You can also do this for the End Date field. It's easy. Let me show you show how, and we'll start by disabling the conditions you don't need:

    1. In Form Builder, click Settings at the top.
    2. Click Conditions on the left menu.Date Picker elements with limits Image 1 Screenshot 60
    3. Check the boxes for IF End Date conditions.
    4. Click Disable.Date Picker elements with limits Image 2 Screenshot 71

    After completing the above steps, we can set the Limits for the End Date field. Here are the rest of the steps:

    1. In Form Builder, click on the End Date field.
    2. Click on the Gear icon.Date Picker elements with limits Image 3 Screenshot 82
    3. Click on the Limits tab in the Date Picker Properties menu on the right.
    4. Enter today+14 under Start Date.Date Picker elements with limits Image 4 Screenshot 93

    Check out the screencast below to see my result: Date Picker elements with limits Image 5 Screenshot 104

    You might also want to check out these guides about How to Use the Date Limits Option and How to Insert Text or Calculation Into a Field Conditionally.

    Give it a try and let us know if you have any other questions.

  • James_Capurso
    Replied on April 23, 2024 at 8:47 PM

    Hi Kelvin,

    Thanks for the prompt response on this,

    I have applied the steps and tested this on a future date, being June 1st, 2024.

    I seems when I select the following:

    • Start Date: June 1st, 2024.
    • End Date: Can be within a 7-day period (however we want to set this up so the earliest date they can pick is 7-days after the start date which in this case would be June 8th and onwards).


    Please review and let me know what I need to do from my end,


    Thanks,

    James

  • Vanessa JotForm Support
    Replied on April 24, 2024 at 12:59 AM

    Hi James,

    Thanks for getting back to us. Do you still need assistance? Upon checking and testing your form, it looks like the date is calculated properly.

    Date Picker elements with limits Image 1 Screenshot 20

    Please check it again and let us know how can we replicate the issue. After we hear back from you, we’ll better understand what’s going on and how to help.

  • James_Capurso
    Replied on April 24, 2024 at 5:22 PM

    Hi Vanessa,

    Thank you for getting back to me on this,

    I have tried and tested the form and it is still showing as the same error.

    For example, if we pick on Start Date as 01-06-2024 the End Date auto calculates and pre-fills as 7-days after this date, therefore it pre-fills as 08-06-2024.

    However, if you click on the calendar icon for End Date, it actually enables you to click on any date prior to 08-06-2024. Whereas all dates prior to 08-06-2024, should be disabled.


    Hopefully that makes sense?

    Please let me know if you require further clarifivcaton,


    Thanks,

    James

  • Christian JotForm Support
    Replied on April 24, 2024 at 7:04 PM

    Hello James,

    Thanks for getting back to us. Unfortunately, it's not possible to conditionally change the Start Date Limit of a Date Picker field based on the value of another Date Picker. This is the reason that although the End Date field on your form automatically shows the date 7 days after the date in the Start Date field, the dates prior to the calculated End Date can still be selected. As a workaround, I recommend displaying an error message if the Start and End Date fields are less than 7 days apart, here's how to do that:

    1. Drag and drop the Paragraph element to the form.
    2. Type your preferred error message.Date Picker elements with limits Image 1 Screenshot 60
    3. Go to the Widgets tab of the Form Elements menu.
    4. Drag and drop the Form Calculation widget to the form.
    5. Add this calculation to the widget: End Date - Start Date.Date Picker elements with limits Image 2 Screenshot 71
    6. Click the Gear icon on the Form Calculation widget.
    7. Go to the Advanced tab of the right menu.
    8. Enable the Hide Field option to hide it.Date Picker elements with limits Image 3 Screenshot 82
    9. Create this Show/Hide Field conditional logic to show the Paragraph element and Hide the Submit button if the End Date is filled and the Form Calculation widget is less than 7.
    10. Make sure to select All from the highlighted dropdown below.Date Picker elements with limits Image 4 Screenshot 93

    After following the steps above, the form responders will be warned and will not be able to submit the form if the selected start and end dates are less than 7 days apart. You can test my demo form from here, and check out the screencast below to see what it looks like afterward:

    Date Picker elements with limits Image 5 Screenshot 104

    Give it a try, and let us know if you have any other questions.

  • James_Capurso
    Replied on April 25, 2024 at 5:07 PM

    Thanks Christian, that seems to work. Any issues, I'll pop it on this thread,


    Thanks,

    James

 
Your Answer