bootstrap-year-calendar icon indicating copy to clipboard operation
bootstrap-year-calendar copied to clipboard

fonction to display quickly the current date on the year calendar

Open th3f4tc4t opened this issue 7 years ago • 3 comments

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');
            }
        }

02

th3f4tc4t avatar Oct 18 '16 03:10 th3f4tc4t

Very useful @th3f4tc4t - thanks.

Do you have any idea how to implement the setCustomDayRenderer? Trying to get a date highlighted onClick.

dxbrich avatar Nov 07 '16 21:11 dxbrich

above code is not working for me..for current date

vijaykumarkarasala avatar Apr 06 '18 11:04 vijaykumarkarasala

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'});
      //  }
  });

dimkoug avatar Sep 17 '18 09:09 dimkoug