title: Set the min date of the other datepicker 1 day ahead of my first datepicker
body: <p>I'm using Materializecss. Now I'm creating a hotel reservation system. What I want is, when I select a date on my DateIn Datepicker, the DateOut Datepicker min date should be 1 day ahead of the date selected. At first selection it is working. But when I try to select a date of check in higher than the selected date out, the min date for dateout picker wont change.</p>
  
  <pre><code>  $('#dp_ci').pickadate(
        {
            selectMonths: true, // Creates a dropdown to control month
            min : new Date(),
            clear: 'Clear',
            close: 'Ok',
            closeOnSelect: false // Close upon selecting a date,       
          });
  
        $('#dp_ci').change(function(){
          selected_ci_date ="";
          selected_ci_date = $('#dp_ci').val();
          if (selected_ci_date != null)
          {
            var cidate = new Date(selected_ci_date);
            alert(cidate);
            $("#dp_co").val("");
            $("#dp_co").removeAttr("disabled");
            min_codate = "";
            min_codate = new Date();
            min_codate.setDate(cidate.getDate()+1);
  
            $('#dp_co').pickadate(
            {
              min : min_codate,
            selectMonths: true, // Creates a dropdown to control month
            clear: 'Clear',
            close: 'Ok',
            closeOnSelect: false // Close upon selecting a date,
          });
  
            $('#dp_co').change(function(){
              if ($('#dp_co').val() != null)
              {
                var ci = new Date($('#dp_ci').val());
                var co = new Date($('#dp_co').val());
                var noOfdays = co.getDate() - ci.getDate() ;
                alert(noOfdays);
              }
            });
  
          }
        })
  </code></pre>
  
  <p>EDIT:
  Example:
  1st Select:
  dp_ci: September 27, 2017 (selected)
  dp_co(min): September 28, 2017 (the dates behind are disabled)
  dp_co: September 28, 2017 (selected)</p>
  
  <p>2nd Select:(I will select on dp_ci again)
  dp_ci: September 29, 2017 (selected)
  dp_co(min): September 28, 2017 (still which was supposed to be September 29)</p>
  
  <p>UPDATE: I found an answer that was able to solve my problem. One only thing is the min date of the dp_co shouldn't allow same date with dp_ci: any solutions?</p>
  
  <pre><code>$('#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)
    }
  })
  </code></pre>
  
  <p>Got the code here:<a href="https://codepen.io/amsul/pen/nGckA" rel="nofollow noreferrer">CodePen</a></p>