![](/img/trans.png)
[英]JQuery UI datepicker how to show next prev arrows for month navigation?
[英]How to modify URL when changing month by clicking on the next/before month arrows using bootstrap datepicker
我有一个 Bootstrap Datepicker,我试图通过单击下个月箭头或箭头前一个月来修改 url。
当我在日历上选择某一天时,URL 发生了变化,但我也不知道如何通过单击箭头来更改 URL。
我的 datepicker.js 文件如下所示:
$(function(){
$('#datetable')
.datepicker({
format: "dd/mm/yyyy",
todayHighlight: true,
clearBtn: true,
daysOfWeekDisabled: [0, 6],
daysOfWeekHighlighted: "0,6",
changeMonth: false
})
.change(function() {
let pickedDate = $("input").val();
if (pickedDate){
$("#showdate").text(
`You picked ${pickedDate}.`);
var date = $('#datetable').datepicker('getDate');
day = date.getDate(date);
month = date.getMonth(date) + 1;
year = date.getFullYear(date);
window.location.assign("https://bloxool-simple.testing.com.co/test/helloworld.php&year=" + year + "&month=" + month + "&day=" + day);
} else {
$("#showdate").text(
`No date chosen.`);
}
});
});
非常感谢您的帮助
这是我的工作解决方案:
$(function () { $('#datetable').datepicker({ format: "dd/mm/yyyy", todayHighlight: true, clearBtn: true, daysOfWeekDisabled: [0, 6], daysOfWeekHighlighted: "0,6", changeMonth: false }).on("changeMonth", function(e) { var date = e.date; day = date.getDate(); month = date.getMonth()+1; year = date.getFullYear(); console.log(day+'/'+month+'/'+year); //window.location.assign("https://bloxool-simple.testing.com.co/test/helloworld.php&year=" + year + "&month=" + month + "&day=" + day); }).on("changeDate", function(e) { var date = e.date; day = date.getDate(); month = date.getMonth()+1; year = date.getFullYear(); console.log(day+'/'+month+'/'+year); //window.location.assign("https://bloxool-simple.testing.com.co/test/helloworld.php&year=" + year + "&month=" + month + "&day=" + day); }); });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/css/bootstrap-datepicker.min.css'> <script src='https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/js/bootstrap-datepicker.min.js'></script> <script src='https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.bundle.min.js'></script> <div id="datetable"> <input id="reservationDate" type="hidden" placeholder="Choose a date" class="form-control py-4 px-4" /> </div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.