我被锁定并缩小了日期选择器
我实际上试图限制用户在 Datepicker 中选择从今天起 2 年内的日期。 所以现在出现了一个问题,当缩小太多时(缩小我的意思是当我们单击月份名称时,它将缩小到所有月份,并且类似地缩小到所有月份到全年) 这就是我所说的缩小
但是如果我缩小到这样的程度以十年或一个世纪为一组显示日历我无法向后放大,或者我的意思是无法返回到可以选择日期的日历视图。
那么有没有办法限制用户在关卡后缩小呢?或者有办法解决吗?
我的日期选择器版本是 Bootstrap v4.1.1
这是我们正在使用的代码
tz_today 是今天的日期,采用 yyyy-mm-dd 格式。
endDate = new Date(new Date().setFullYear(new Date().getFullYear() + 2)); pickDate = 新日期(pickDate); // 采用 yyyy-mm-dd 格式
$('#Datepicker').datepicker('destroy').datepicker({
todayHighlight: true,
beforeShowDay: function (date) {
$highlight = calendar_highlight_classes(highlight_dates, pickDate, date);
return $highlight;
}
}).datepicker('setStartDate', new Date(tz_today))
.datepicker('setEndDate', endDate);
I actually tried to restrict users to pick dates within 2 years from today in Datepicker.
So now there is one issue that is coming up that when in zoom out too much (By zooming out I mean when we click on the month name it will zoom out to all months and and similarly all month to all year)
this is the zooming out I am talking about
but if I zoom out to such an extent where it shows the calendar in group of a decade or a century I am not able to zoom in back or I mean not able to go back to the calendar view where I could select dates.
so is there a way to restrict users to zoom out after a level? or is there a way to fix it?
My datepicker version is Bootstrap v4.1.1
This is the code we are using
tz_today Is today's date in yyyy-mm-dd format.
endDate = new Date(new Date().setFullYear(new Date().getFullYear() + 2));
pickDate = new Date(pickDate); // in yyyy-mm-dd format
$('#Datepicker').datepicker('destroy').datepicker({
todayHighlight: true,
beforeShowDay: function (date) {
$highlight = calendar_highlight_classes(highlight_dates, pickDate, date);
return $highlight;
}
}).datepicker('setStartDate', new Date(tz_today))
.datepicker('setEndDate', endDate);
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
对我来说 MaxViewMode 很有魅力。默认情况下,它设置为 4,但我们可以根据它进行更改。到我们的偏好
天数(0) ->月(1) ->年(2) ->十年(3) -> century(4)
MaxViewMode: 2 - 限制用户最多可进入年份视图模式
我的代码限制用户只能进入年份
以下是文档 https://bootstrap-datepicker.readthedocs.io/en/latest/options.html#maxviewmode
Well for me MaxViewMode worked like a charm. By default, it is set as 4 but we can change it acc. to our preference
days(0) -> month(1) -> year(2) -> decade(3) -> century(4)
MaxViewMode: 2 - to limit users to go up to years view mode
my code to limit users to go only till year
Here is the documentation https://bootstrap-datepicker.readthedocs.io/en/latest/options.html#maxviewmode