Comment définir la date de demain par défaut à l'aide du sélecteur de date?

Question

Je fais un projet de réservation d'hôtel dans lequel je dois donner deux champs de saisie comme date d'arrivée et de départ, En date d'arrivée j'ai montré la date du jour par défaut et l'utilisateur peut cliquer dessus et changer la date. Pas de problème pour moi avec la date d'arrivée. Mais la question est avec la date de départ, la même chose que j'ai fait pour la date de départ, mais il ne fonctionne pas et rien affiché dans la date de départ. Quels changements devrais-je devoir faire ici?

Les codes comme suit,

$(document).ready(function() { 
 
    var date = new Date(); 
 
    var today = new Date(date.getFullYear(), date.getMonth(), date.getDate()); 
 
    var tomorrow = new Date(date.getFullYear(), date.getMonth(), date.getDate()); 
 
    var end = new Date(date.getFullYear(), date.getMonth(), date.getDate()); 
 

 
    $('#datepicker1').datepicker({ 
 
format: "mm/dd/yyyy", 
 
todayHighlight: true, 
 
startDate: today, 
 
endDate: end, 
 
autoclose: true 
 
    }); 
 
    $('#datepicker2').datepicker({ 
 
format: "mm/dd/yyyy", 
 
todayHighlight: true, 
 
startDate: tomorrow, 
 
endDate: end, 
 
autoclose: true, 
 
minDate : "+1" 
 
    }); 
 

 
}); 
 
$('#datepicker1').datepicker('setDate', '0'); 
 
$('#datepicker2').datepicker('setDate', '1');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script> 
 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" /> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.5.1/js/bootstrap-datepicker.js"></script> 
 
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.5.1/css/bootstrap-datepicker.min.css" /> 
 

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

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

Et aussi je dois cacher les dates antérieures à-dire, je dois fixer des dates actifs de seulement aujourd'hui et tout le reste des dates jusqu'à hier doit être état inactif.

Veuillez me donner ces deux solutions pour résoudre mon problème.

Answer 1

Ici, vous allez avec la solution https://jsfiddle.net/7wdw0fr6/1/

$(document).ready(function() { 
 
    var date = new Date(); 
 
    var today = new Date(date.getFullYear(), date.getMonth(), date.getDate()); 
 
    var tomorrow = new Date(date.getFullYear(), date.getMonth(), (date.getDate() + 1)); 
 
    var end = new Date(date.getFullYear(), date.getMonth(), (date.getDate() + 1)); 
 
\t 
 
    $('#datepicker1').datepicker({ 
 
    format: "mm/dd/yyyy", 
 
    todayHighlight: true, 
 
    startDate: today, 
 
    endDate: end, 
 
    autoclose: true 
 
    }); 
 
    $('#datepicker2').datepicker({ 
 
    format: "mm/dd/yyyy", 
 
    startDate: tomorrow, 
 
    endDate: end, 
 
    autoclose: true 
 
    }); 
 
    
 
    $('#datepicker1').datepicker('setDate', '0'); 
 
    var datepicker2 = (date.getMonth() + 1) + '/' + (date.getDate() + 1) + '/' + date.getFullYear(); 
 

 
    $('#datepicker2').datepicker('setDate', datepicker2); 
 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script> 
 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" /> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.5.1/js/bootstrap-datepicker.js"></script> 
 
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.5.1/css/bootstrap-datepicker.min.css" /> 
 

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

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

erreur $ ('# DATEPICKER1') datepicker ('setDate', '1').

devrait être $ ('# DATEPICKER2') datepicker ('setDate', '1').