Replace datepicker and remove datepicker inline JS

This commit is contained in:
MichiK 2018-12-04 21:03:32 +01:00
parent 36b7f8d2a2
commit 4e3232e57a
4 changed files with 39 additions and 19 deletions

View File

@ -72,23 +72,10 @@ function form_date($name, $label, $value, $start_date = '', $end_date = '')
$shortLocale = substr($locale, 0, 2);
return form_element($label, '
<div class="input-group date" id="' . $dom_id . '">
<div class="input-group date" id="' . $dom_id . '" data-locale="' . $shortLocale . '" data-min-date="' . $start_date . '" data-max-date="' . $end_date . '">
<input type="date" placeholder="YYYY-MM-DD" name="' . $name . '" class="form-control" value="' . htmlspecialchars($value) . '">'
. '<span class="input-group-addon">' . glyph('th') . '</span>
</div>
<script type="text/javascript">
$(function(){
$("#' . $dom_id . '").children("input").attr("type", "text");
$("#' . $dom_id . '").datepicker({
language: "' . $shortLocale . '",
todayBtn: "linked",
format: "yyyy-mm-dd",
startDate: "' . $start_date . '",
endDate: "' . $end_date . '",
orientation: "bottom"
});
});
</script>
', $dom_id);
}

View File

@ -14,11 +14,12 @@
},
"dependencies": {
"bootstrap": "^3.3.7",
"bootstrap-datepicker": "^1.7.1",
"chart.js": "^1.0.2",
"eonasdan-bootstrap-datetimepicker": "^4.17.47",
"jquery": "^3.3.1",
"jquery-ui": "^1.11.2",
"moment": "^2.8.2",
"moment-timezone": "^0.4.0",
"select2": "^4.0.6-rc.1",
"select2-bootstrap-theme": "0.1.0-beta.10"
},

View File

@ -92,3 +92,36 @@ $(function () {
return ($(window).height() - 50) + 'px';
}).css('overflow-y', 'scroll');
});
/*
* Add a datepicker to all date input fields.
*/
$(function () {
$('.input-group.date').each(function () {
var elem = $(this);
var opts = {
minDate: '',
maxDate: '',
locale: 'en',
format: 'YYYY-MM-DD',
widgetPositioning: {horizontal: 'auto', vertical: 'bottom'}
};
$.extend(opts, elem.data());
if (opts.minDate.length === 0) {
delete opts.minDate;
}
if (opts.maxDate.length === 0) {
delete opts.maxDate;
}
elem.children('input').attr('type', 'text');
elem.children().on('click', function (ev) {
ev.stopImmediatePropagation();
if (elem.data('DateTimePicker') === undefined) {
elem.datetimepicker(opts);
elem.data('DateTimePicker').show();
} else {
elem.data('DateTimePicker').toggle();
}
});
});
});

View File

@ -1,12 +1,11 @@
window.$ = window.jQuery = require('jquery');
require('imports-loader?define=>false!jquery-ui');
require('bootstrap');
require('imports-loader?define=>false&exports=>false!bootstrap-datepicker');
require('bootstrap-datepicker/js/locales/bootstrap-datepicker.de');
require('bootstrap-datepicker/dist/css/bootstrap-datepicker3.min.css');
require('imports-loader?this=>window!chart.js');
require('imports-loader?this=>window&define=>false&exports=>false!moment');
require('imports-loader?this=>window&define=>false&exports=>false!moment/locale/de');
require('imports-loader?define=>false&exports=>false!eonasdan-bootstrap-datetimepicker');
require('eonasdan-bootstrap-datetimepicker/build/css/bootstrap-datetimepicker.min.css');
require('imports-loader?this=>window!chart.js');
require('./forms');
require('./sticky-headers');
require('./moment-countdown');