用户在页面上有2个输入,并且应该能够选择从开始日期到结束日期的3个月内的任何日期范围。 enddate也应该早于startdate,相同的检查阻止startdate晚于enddate。有没有办法在没有外部验证的情况下在datepicker中包含日期范围限制?用户可以选择的日期不限于他们可以走多远。如果他们想要2年前的数据,他们可以从那一年开始提前3个月。在页面加载时,enddate是从今天开始的2天,startdate是今天的日期。
编辑:
$(function () {
$("#startDate").datepicker({
onSelect: function (selectedDate) {
var orginalDate = new Date(selectedDate);
var monthsAddedDate = new Date(new Date(orginalDate).setMonth(orginalDate.getMonth() + 3));
alert(monthsAddedDate);
$("#endDate").datepicker("option", 'minDate', selectedDate);
$("#endDate").datepicker("option", 'maxDate', monthsAddedDate);
}
});
$("#endDate").datepicker({
onSelect: function (selectedDate) {
var orginalDate = new Date(selectedDate);
var monthsAddedDate = new Date(new Date(orginalDate).setMonth(orginalDate.getMonth() - 3));
alert(monthsAddedDate);
$("#startDate").datepicker("option", 'minDate', selectedDate);
$("#startDate").datepicker("option", 'maxDate', monthsAddedDate);
}
})
});
答案 0 :(得分:3)
解决了它!!!!我不得不切换用变量设置最小和最大日期的位置。我让他们倒退了。现在你不能超过3个月的任何一个日期,但可以在3个月内选择任何日期:D
$(function () {
$("#startDate").datepicker({
onSelect: function (selectedDate) {
var orginalDate = new Date(selectedDate);
var monthsAddedDate = new Date(new Date(orginalDate).setMonth(orginalDate.getMonth() + 3));
alert(monthsAddedDate);
$("#endDate").datepicker("option", 'minDate', selectedDate);
$("#endDate").datepicker("option", 'maxDate', monthsAddedDate);
}
});
$("#endDate").datepicker({
onSelect: function (selectedDate) {
var orginalDate = new Date(selectedDate);
var monthsAddedDate = new Date(new Date(orginalDate).setMonth(orginalDate.getMonth() - 3));
alert(monthsAddedDate);
$("#startDate").datepicker("option", 'minDate', monthsAddedDate);
$("#startDate").datepicker("option", 'maxDate', selectedDate);
}
})
});
答案 1 :(得分:2)
Jquery Datepicker日期范围限制30天 请参阅此链接
http://www.freshcodehub.com/Article/25/jquery-datepicker-date-range-restriction-in-aspnet
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script>
$(function () {
$("#datepicker").datepicker({ minDate: -15, maxDate: +15 });
});
</script>
<input type="textbox" id="datepicker">