bootstrap datetimepicker - 设置相对于现在的 maxDate?
bootstrap datetimepicker - set maxDate relative to now?
我使用这个日期时间选择器:
http://eonasdan.github.io/bootstrap-datetimepicker/Options/
基本上我想设置 maxDate: moment()
,即 maxDate 应该限制在现在。
问题是当日期选择器打开时,maxDate 不再是 now() 了。
每次显示日期选择器时,我都想将它的 maxDate 设置为现在。
如果可能,我想在全球范围内强制执行,而不是在每个 datetimepicker()
实例上指定它。是否可以使用 moment.js 以某种方式给出与 now 相关的日期?
看到这个fiddle:
https://jsfiddle.net/0Ltv25o8/3281/
我将 maxDate 设置为现在。您会在页面加载后看到,您将无法使用箭头按钮选择当前分钟数。
每次选择器显示时,您都可以收听dp.show
event so you can change maxDate
当前时间。这里有一个代码示例:
$('#datetimepicker1').datetimepicker({
maxDate: moment(),
format:'DD/MM/YYYY HH:mm'
}).on('dp.show', function(){
$('#datetimepicker1').data("DateTimePicker").maxDate(moment());
});
<link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/css/bootstrap.css" rel="stylesheet"/>
<link href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/css/bootstrap-datetimepicker.css" rel="stylesheet"/>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.13.0/moment.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/js/bootstrap.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/js/bootstrap-datetimepicker.min.js"></script>
<div class="form-group">
<div class="input-group date" id="datetimepicker1">
<input type="text" class="form-control" />
<span class="input-group-addon"><span class="glyphicon-calendar glyphicon"></span></span>
</div>
</div>
使用自定义版本的日期选择器插件如何?
我添加了新参数 maxDateNow
(有更好的名字吗?)允许选择 date/time 到现在为止。
$('#datetimepicker1').datetimepicker({maxDateNow: true, format:'DD/MM/YYYY HH:mm'});
看到这个fiddle
我用了 Like This,它将最小日期设置为今天的日期
$( '#Field_ID' ).datepicker({dateFormat: 'dd-MM-yy', minDate : new Date()});
我使用这个日期时间选择器:
http://eonasdan.github.io/bootstrap-datetimepicker/Options/
基本上我想设置 maxDate: moment()
,即 maxDate 应该限制在现在。
问题是当日期选择器打开时,maxDate 不再是 now() 了。
每次显示日期选择器时,我都想将它的 maxDate 设置为现在。
如果可能,我想在全球范围内强制执行,而不是在每个 datetimepicker()
实例上指定它。是否可以使用 moment.js 以某种方式给出与 now 相关的日期?
看到这个fiddle:
https://jsfiddle.net/0Ltv25o8/3281/
我将 maxDate 设置为现在。您会在页面加载后看到,您将无法使用箭头按钮选择当前分钟数。
每次选择器显示时,您都可以收听dp.show
event so you can change maxDate
当前时间。这里有一个代码示例:
$('#datetimepicker1').datetimepicker({
maxDate: moment(),
format:'DD/MM/YYYY HH:mm'
}).on('dp.show', function(){
$('#datetimepicker1').data("DateTimePicker").maxDate(moment());
});
<link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/css/bootstrap.css" rel="stylesheet"/>
<link href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/css/bootstrap-datetimepicker.css" rel="stylesheet"/>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.13.0/moment.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/js/bootstrap.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/js/bootstrap-datetimepicker.min.js"></script>
<div class="form-group">
<div class="input-group date" id="datetimepicker1">
<input type="text" class="form-control" />
<span class="input-group-addon"><span class="glyphicon-calendar glyphicon"></span></span>
</div>
</div>
使用自定义版本的日期选择器插件如何?
我添加了新参数 maxDateNow
(有更好的名字吗?)允许选择 date/time 到现在为止。
$('#datetimepicker1').datetimepicker({maxDateNow: true, format:'DD/MM/YYYY HH:mm'});
看到这个fiddle
我用了 Like This,它将最小日期设置为今天的日期
$( '#Field_ID' ).datepicker({dateFormat: 'dd-MM-yy', minDate : new Date()});