Datepicker - 在入住日期后1天自动分配

时间:2015-04-30 03:49:59

标签: jquery datepicker

我想在退房日期的入住日期后1天分配..并在结账日期隐藏所选日期和入住日期日期选择日期之前的日期..

<table>
    <tr>
        <td>
            <br>Check in date
        <td width="10">
            <br>:
        </td>
        <td>
            <br>
            <input type = "date" name= "datein"  placeholder="yyyy-mm-dd" id="datepicker1" class="date"/>
        </td>

<script>
$( "#datepicker1" ).datepicker({
    minDate: 0,
    dateFormat: "yy-mm-dd",
    maxDate: '+30D',
});
</script>

        </td>
    </tr>

    <tr>
        <td>
            <br>Check out date
        <td width="10">
            <br>:
        </td>
        <td>
            <br>
            <input type = "date" name= "dateout"  placeholder="yyyy-mm-dd" id="datepicker2" class="date"/>
        </td>

<script>
$( "#datepicker2" ).datepicker({
    minDate: 0,
    dateFormat: "yy-mm-dd",
    maxDate: '+30D'
});
</script>

        </td>
    </tr>
</table>

3 个答案:

答案 0 :(得分:1)

对不起,我错过了一部分。我的答案已修改,请参阅this

我在here上使用了同样的内容,如下所示

$( "#datepicker1" ).datepicker({
defaultDate: +1,        
dateFormat: 'dd/mm/yy',
beforeShow: function(input, inst) {
    //datepopupdirection(input, inst); - ignore this line     
},
minDate: new Date(),        
onSelect: function(dateText, inst) {
  if($('#datepicker2').val() == '') {
    var current_date = $.datepicker.parseDate('dd/mm/yy', dateText);
    current_date.setDate(current_date.getDate()+1);
    $('#datepicker2').datepicker('setDate', current_date);
  }
},
onClose: function(selectedDate, test) {
    if(selectedDate != ""){
      var $date = new Date($( "#datepicker1" ).datepicker( "getDate" ));
      $date.setDate($date.getDate()+1);

      $( "#datepicker2" ).datepicker( "option", "minDate", $date );
      $( "#datepicker2" ).datepicker('setDate', $date);

      /* set the max date range 2months */
      var $minusDate = new Date($( "#datepicker1" ).datepicker( "getDate" ));
      $minusDate.setDate($minusDate.getDate()-1);
      var maxDate = new Date($minusDate);
      maxDate.setMonth(maxDate.getMonth()+ 2);
      $( "#datepicker2" ).datepicker( "option", "maxDate", maxDate );
    }            
}});


$( "#datepicker2" ).datepicker({
    dateFormat: 'dd/mm/yy',
    beforeShow: function(input, inst) {
        //insertArrow();
        //datepopupdirection(input, inst);
    },
    minDate: new Date(),
    onClose: function( selectedDate ) {
        if(selectedDate != ""){
            /*$( "#H-startDate" ).datepicker( "option", "maxDate", selectedDate );*/
        }
    }
});
希望这有帮助!!如果您需要更多说明,请告诉我

答案 1 :(得分:0)

我已根据我的姓名日期选择器更改日期选择器名称

$( "#datepicker1" ).datepicker({
    defaultDate: +1,        
    dateFormat: 'dd/mm/yy',
    beforeShow: function(input, inst) {
        //datepopupdirection(input, inst); - ignore this line     
    },
    minDate: new Date(),        
    onSelect: function(dateText, inst) {
      if($('#datepicker2').val() == '') {
        var current_date = $.datepicker.parseDate('dd/mm/yy', dateText);
        current_date.setDate(current_date.getDate()+1);
        $('#datepicker2').datepicker('setDate', current_date);
      }
    },
    onClose: function(selectedDate, test) {
        if(selectedDate != ""){
          var $date = new Date($( "#datepicker1" ).datepicker( "getDate" ));
          $date.setDate($date.getDate()+1);

          $( "#datepicker2" ).datepicker( "option", "minDate", $date );
          $( "#datepicker2" ).datepicker('setDate', $date);

          /* set the max date range 2months */
          var $minusDate = new Date($( "#datepicker1" ).datepicker( "getDate" ));
          $minusDate.setDate($minusDate.getDate()-1);
          var maxDate = new Date($minusDate);
          maxDate.setMonth(maxDate.getMonth()+ 2);
          $( "#datepicker2" ).datepicker( "option", "maxDate", maxDate );
        }            
    }

});

答案 2 :(得分:0)

您可以使用此功能实现。

演示

$("#datepicker1").datepicker({
    minDate: 0,
    dateFormat: "yy-mm-dd",
    maxDate: '+30D',
    onSelect: function() {
       var date = new Date($(this).val());
        var ret = new Date(date.setDate(date.getDate() + 1));
      var year = ret.getFullYear(), month = (ret.getMonth() + 1), day = ret.getDate();
        
        
       $("#datepicker2").val(year+"-"+month+"-"+day);
       
        
    }
});
<link href="http://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css" rel="stylesheet"/>
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

<input type="text" id="datepicker1" />

<input type="text" id="datepicker2" />