bootstrap-year-calendar
bootstrap-year-calendar copied to clipboard
fonction to display quickly the current date on the year calendar
My quick function to show the current date on the year calendar. Strangely I did not find this basic functionality into documentation.
var currentYear = new Date().getFullYear();
var currentMonth = new Date().getMonth();
var currentDate = new Date().getDate();
var circleDateTime = new Date(currentYear, currentMonth, currentDate).getTime();
customDayRenderer: function(element, date) {
if(date.getTime() == circleDateTime) {
$(element).css('background-color', 'red');
$(element).css('color', 'white');
$(element).css('border-radius', '15px');
}
}
Very useful @th3f4tc4t - thanks.
Do you have any idea how to implement the setCustomDayRenderer? Trying to get a date highlighted onClick.
above code is not working for me..for current date
I use the mommentjs library
<style media="screen">
.currentDate {
background-color: red !important;
}
</style>
var currentDate = new Date();
var curDay = moment(currentDate).format('MM/DD/YYYY');
$('#calendar').calendar({
enableContextMenu: false,
enableRangeSelection: false,
dataSource: [],
startYear: currentYear,
// displayHeader: true,
minDate: currentDate,
maxDate: new Date(year + 10, month, day),
customDayRenderer: function(element, date) {
var elemdate = moment(date).format('MM/DD/YYYY');
var $element = $(element);
var $parent = $element.parent();
if(curDay === elemdate) {
$parent.addClass('currentDate');
}
},
// customDataSourceRenderer: function(element, date, event) {
// // This will override the background-color to the event's color
// $(element).css({'border-radius':'15px', 'color': 'red'});
// $(element).css({'border-radius':'15px', 'color': 'red'});
// }
});