jquerydatedatepickerpickadate

pickadate: end date should be 1 day ahead to the start date


I have two datepickers (Materializecss) one for the check in date and another one for check out date. what I want is I want the check out date min date is 1 day ahead to the check in date. i got this code on pickadate js but the problem is the selected date on the first datepicker is enabled in the end datepicker. What I want to happen is when I select 9/22/2017, the minimum date on the end datepicker should be 9/23/2017

$('#dp_ci').pickadate(
    {
        selectMonths: true, // Creates a dropdown to control month
        today: 'Today',
        clear: 'Clear',
        close: 'Ok',
        min: new Date()
      });


    var from_$input = $('#dp_ci').pickadate(),
    from_picker = from_$input.pickadate('picker')

    var to_$input = $('#dp_co').pickadate(),
    to_picker = to_$input.pickadate('picker')


    // Check if there’s a “from” or “to” date to start with.
    if ( from_picker.get('value') ) 
    {
      to_picker.set('min', from_picker.get('select'))
    }
    if ( to_picker.get('value') ) 
    {
      from_picker.set('max', to_picker.get('select'))


    }
    // When something is selected, update the “from” and “to” limits.
    from_picker.on('set', function(event) 
    {

      if ( event.select ) 
      {
        to_picker.set('min', from_picker.get('select'))    
      }

      else if ( 'clear' in event ) 
      {
        to_picker.set('min', false)
      }

    })

    to_picker.on('set', function(event) 
    {
      if ( event.select ) 
      {
        from_picker.set('max', to_picker.get('select'))
      }
      else if ( 'clear' in event ) 
      {
        from_picker.set('max', false)
      }
    })

Solution

  •  $('#dp_ci').pickadate(
        {
            selectMonths: true, // Creates a dropdown to control month
            today: 'Today',
            clear: 'Clear',
            close: 'Ok',
            min: new Date()
          });
    
    
    
    
        var from_$input = $('#dp_ci').pickadate(),
        from_picker = from_$input.pickadate('picker')
    
        var to_$input = $('#dp_co').pickadate(),
        to_picker = to_$input.pickadate('picker')
    
    
        // Check if there’s a “from” or “to” date to start with.
        if ( from_picker.get('value') ) 
    
        {        
           var today = new Date($('#dp_ci').val());
           today.setDate(today.getDate() + 1)
          to_picker.set('min', today)
        }
        if ( to_picker.get('value') ) 
        {
           var today = new Date($('#dp_co').val());
        today.setDate(today.getDate() - 1)
          from_picker.set('max', today)
    
    
        }
        // When something is selected, update the “from” and “to” limits.
        from_picker.on('set', function(event) 
        {
    
          if ( event.select ) 
          {
             var today = new Date($('#dp_ci').val());
        today.setDate(today.getDate() + 1)
            to_picker.set('min', today)    
          }
    
          else if ( 'clear' in event ) 
          {
    
            to_picker.set('min', false)
          }
    
        })
    
        to_picker.on('set', function(event) 
        {
          if ( event.select ) 
          {
            var today = new Date($('#dp_co').val());
        today.setDate(today.getDate() - 1)
            from_picker.set('max', today)
          }
          else if ( 'clear' in event ) 
          {
    
            from_picker.set('max', false)
          }
        })
    

    I added today variable (sorry wasn't able to change the name anymore :)