加载Bootstrap-datetimepicker插件的js.
HTML中：<input type=”text” value=”2012-05-15 21:05″ id=”datetimepicker”>
JS中：$(‘#datetimepicker’).datetimepicker({
format: ‘yyyy-mm-dd hh:ii’
});
类似案例：
HTML：
<div id=”date-from-picker” class=”input-group date datepicker”>
<input type=”text” name=”date_from”
class=”form-control” readonly=”readonly”
value=”{
{ array_get($search, ‘date_from’) }}” />
<span class=”input-group-addon”><i class=”glyphicon glyphicon-remove”></i></span>
<span class=”input-group-addon”><i class=”glyphicon glyphicon-calendar”></i></span>
</div>
JS:
requirejs([‘../config’], function () {
require([‘jquery’, ‘bootstrap’, ‘datetimepicker-locale-zh-CN’], function ($) {
var dateFromPicker = $(‘#date-from-picker’),
dateFromInput = dateFromPicker.find(‘input’),
dateToPicker = $(‘#date-to-picker’),
dateToInput = dateToPicker.find(‘input’);
dateFromPicker.datetimepicker({
format: ‘yyyy-mm-dd’,
autoclose: true,
todayBtn: true,
minuteStep: 5,
language: ‘zh-CN’,
minView: ‘month’
});
dateToPicker.datetimepicker({
format: ‘yyyy-mm-dd’,
autoclose: true,
todayBtn: true,
minuteStep: 5,
language: ‘zh-CN’,
minView: ‘month’
});
dateFromPicker.on(‘changeDate’, function (event) {
var toDate = dateToInput.val(),
date = event.date;
if (date) {
date.setUTCHours(0);
date.setUTCMinutes(0);
date.setUTCSeconds(0);
date.setUTCMilliseconds(0);
}
dateToPicker.datetimepicker(‘setStartDate’, event.date);
if ($.trim(toDate) !== ” && event.date > new Date(toDate)) {
dateToInput.val(”);
dateToPicker.datetimepicker(‘update’);
}
});
dateToPicker.on(‘changeDate’, function (event) {
var fromDate = dateFromInput.val(),
date = event.date || new Date();
if (date) {
date.setUTCHours(0);
date.setUTCMinutes(0);
date.setUTCSeconds(0);
date.setUTCMilliseconds(0);
}
dateFromPicker.datetimepicker(‘setEndDate’, date);
if ($.trim(fromDate) !== ” && date < new Date(fromDate)) {
dateFromInput.val(”);
dateFromPicker.datetimepicker(‘update’);
}
});
});
});