Gravity Forms – Date Picker – Disallow End Date to be before Start Date

1 Views

basically I have a large form created on my WordPress site using Gravity Forms. One section of my forms has a bunch of items listed with a ‘Start Date’ followed by an ‘End Date’ — Example:

Item | Start Date | End Date

Read More

Item#1 | 05/01/2015 | 05/25/2015

What I am after is making it so I can disallow the ‘End Date’ from being before the selected ‘Start Date’. It would be best if the user was unable to even select the date from the date picker drop down, but if it has to be an error that pops up on submission, that is fine to. I have been researching this for hours and I am just too noob to know exactly what to do. Thanks for any and all help!

Post Views: 1

Related posts

1 comment

  1. Try something like this, which uses jQuery’s datepicker functions:

      <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
  <script src="//code.jquery.com/jquery-1.10.2.js"></script>
  <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
  <link rel="stylesheet" href="https://jqueryui.com/resources/demos/style.css">
  <script>
  $(function() {
    $( "#from" ).datepicker({
      defaultDate: "+1w",
      changeMonth: true,
      numberOfMonths: 3,
      onClose: function( selectedDate ) {
        $( "#to" ).datepicker( "option", "minDate", selectedDate );
      }
    });
    $( "#to" ).datepicker({
      defaultDate: "+1w",
      changeMonth: true,
      numberOfMonths: 3,
      onClose: function( selectedDate ) {
        $( "#from" ).datepicker( "option", "maxDate", selectedDate );
      }
    });
  });
  </script>
<label for="from">From</label>
<input type="text" id="from" name="from">
<label for="to">to</label>
<input type="text" id="to" name="to">

Comments are closed.