Semantic-UI-Calendar
Semantic-UI-Calendar copied to clipboard
Container (date) value not refreshed upon value change...
...but only when the widget is opened and then closed.
My initialzation:
$('#daypicker').calendar({
type: 'date',
firstDayOfWeek: 1,
constantHeight: false,
disableYear: true,
disableMonth: true,
disableMinute: true,
minDate: new Date(getStartDate()),
maxDate: new Date(getEndDate()),
popupOptions: {
position: 'bottom center',
},
formatter: {
date: function(date, settings) {
return settings.text.monthsShort[date.getMonth()] + ' ' + date.getDate() + ', ' + date.getFullYear();
}
},
onChange: function(date, text, mode) {
console.log('change to date:', text);
var strDate = formatDateToString(date);
currentDayTileSources = getTileSourcesForDate(strDate);
viewer.close().open(currentDayTileSources);
if (forcedInitial) {
forcedInitial = false;
viewer.goToPage(currentDayTileSources.length - 1);
}
toggleDayButtons(strDate);
},
isDisabled: function(date, mode) {
return !_.includes(singleDays, formatDateToString(date));
}
});
$('#daypicker').calendar('set date', new Date(getEndDate()));
I've seen that the closing of the widget actually calls this function that gets the job done:
inputBlur: function () {
$container.removeClass(className.active);
if (settings.formatInput) {
var date = module.get.date();
var text = formatter.datetime(date, settings);
$input.val(text);
}
}
so, to fix (my) issue, it's enough to also format and update the $input after the refresh
(as the create
module somehow doesn't do it):
refresh: function () {
module.create.calendar();
var date = module.get.date();
var text = formatter.datetime(date, settings);
$input.val(text);
},
Sounds sensible?