J'ai un sélecteur de deux rendez-vous. Dans le premier sélecteur de satellie est une date de début et une date de début de la date est une date de fin.
Ce que je fais est, ma plage de date de fin est J'ai choisi Date de début Maintenant mon problème est si l'utilisateur choisit la date de début alors ma date de date est de 31-03. p> Je sais que je dois utiliser quelque chose comme ci-dessous le code mais je suis confus Comment puis-je utiliser cela? Devrais-je utiliser si la condition? p> m'aideriez-vous sur ce numéro? p> p> 31-03-an (en fonction de la date de début) Code>. P> 31-01-2019 Code> Pour que l'utilisateur puisse choisir la date de fin, jusqu'à ce que 31-03-2019 code>. Ce scénario fonctionne pour moi (enregistrement dans l'extrait de l'extrait). P> 01-04-2019 code> puis la date de fin peut choisir jusqu'à 31-03-2020 code>. p>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<div class="form-group">
<label>Start Date</label>
<input type="text" name="start_date" placeholder="Start Date" id="start_date" class="start_date form-control">
</div>
<div class="form-group">
<label>End Date</label>
<input type="text" name="end_date" id="end_date" placeholder="End Date" class="end_date form-control">
</div>
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
4 Réponses :
Cette fonction vous trouvera le 31 mars suivant après la date de saisie. Après cela, il devrait être simple.
p>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> <div class="form-group"> <label>Start Date</label> <input type="text" name="start_date" placeholder="Start Date" id="start_date" class="start_date form-control"> </div> <div class="form-group"> <label>End Date</label> <input type="text" name="end_date" id="end_date" placeholder="End Date" class="end_date form-control"> </div> <script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js"></script> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
Donnez-moi un peu de temps pour vérifier cette réponse
Réponse mise à jour. Vérifiez cela à fond mais cela semble fonctionner. Vous devriez faire quelque chose à limiter la date de fin aux dates après date de début?
Laisse moi vérifier. Donnez-moi un peu de temps pour vérifier à nouveau
Comme date de début est limitée à l'année en cours et la date cible est le dernier jour du mois, vous n'avez rien de vérifier d'autre que le mois de la date de début.
onSelect: function(dt, dp) {
var selected = $.datepicker.parseDate("dd-mm-yy", dt);
var yy = selected.getFullYear();
var mm = selected.getMonth();
var dd = selected.getDate();
if(mm > 2) //date is later than march
yy++;
var nextYear = $.datepicker.parseDate("dd-mm-yy", "31-03-" + (yy));
$(".end_date").datepicker("option", "maxDate", nextYear);
}
Donnez-moi un peu de temps pour vérifier cette réponse
Cette approche fonctionnera, mais ... l'entrée sera un objet de date UTC de minuit. Si vous le manipulez avec des méthodes non utuc, vous obtiendrez Effets étranges bizary . GetDate () retournera la veille des utilisateurs à l'ouest de Londres.
C'est comme ça que je ferais cela
p>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> <div class="form-group"> <label>Start Date</label> <input type="text" name="start_date" placeholder="Start Date" id="start_date" class="start_date form-control"> </div> <div class="form-group"> <label>End Date</label> <input type="text" name="end_date" id="end_date" placeholder="End Date" class="end_date form-control"> </div> <script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js"></script> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
Merci pour la réponse, mais à la date de début, il affiche toutes les années. J'ai besoin d'une seule année en cours. De plus, j'ai choisi la date 01-04-2019 dans la date de début et la date de fin de la date de début 2019. Il devrait être le 20 mars 2020
Cette réponse a eu deux pouces. mais pourquoi? Ce n'est pas une sortie attendue.
Tout cela va bien, mais vous allez avoir des problèmes de fuseau horaire bizarre. Si vous êtes sous Windows, cliquez avec le bouton droit de la souris sur votre horloge, en bas à droite. Définissez le fuseau horaire à quelque chose de négatif, n'importe où en Amérique, par exemple, faites Nouvelle date ('2018-01-01'). GeinDeary () . Voyez-vous ce que vous attendez? Pour manipuler en toute sécurité les dates, vous devez vous assurer de garder le fuseau horaire, en utilisant uniquement les méthodes UTC.
Près de! ... Nouvelle date () On Line 14 est sensible au TimeZone. Cela vous donne une date plus un temps et cela se comportera différemment pour les utilisateurs de différents fuseaux horaires . Mettez votre machine dans certaines fuseaux horaires d'Eastern Timezone, en Australie, en Inde, en Europe, puis essayez Nouvelle date (2018,0,1) .GETTCully () . Voyez-vous ce que vous attendez?
Nouvelle date (2018,0,1) Vous obtient heure locale de minuit. Nouvelle date ('2018-01-01') Vous obtient minuit à Londres. Confus maintenant?
@bbsimonbb> confus maintenant? Pas vraiment, selon les documents, lorsque le constructeur est appelé avec plus d'un argument, il renvoie la date locale, plutôt que l'UTC. Maintenant, comme je m'adressions à votre dernière préoccupation (j'espère) cette réponse mérite définitivement upvote et accepte;)
var year = (new Date).getFullYear();
$(".start_date").datepicker({
dateFormat: "dd-mm-yy",
changeMonth: true,
changeYear: true,
minDate: 0,
//maxDate : "+0Y",
yearRange: new Date().getFullYear() + ':' + new Date().getFullYear(),
showAnim: "clip",
//numberOfMonths: 1,
onSelect: function (dt, dp) {
var selected = $.datepicker.parseDate("dd-mm-yy", dt);
var yy = selected.getFullYear();
var mm = selected.getMonth();
var dd = selected.getDate();
if(mm > 2) {
yy++;
}
else {
yy;
}
var nextYear = $.datepicker.parseDate("dd-mm-yy", "31-03-" + (yy));
$(".end_date").datepicker("option", "maxDate", nextYear);
}
});
$(".end_date").datepicker({
buttonText: "Select date",
dateFormat: "dd-mm-yy",
changeMonth: true,
changeYear: true,
minDate: 0,
showAnim: "clip",
});
Duplicaté possible de Comment Est-ce que j'affiche la date de fin de 31-03-na (selon la start_date)?