This is a migrated thread and some comments may be shown as answers.

KendoCalendar get month value

1 Answer 458 Views
Calendar
This is a migrated thread and some comments may be shown as answers.
Emanuel
Top achievements
Rank 1
Emanuel asked on 25 May 2017, 11:44 AM

Hello,

How can I get the selected month from a kendoCalendar??

i have this code behind:

$(function() {

var listaZile=[];
  var today = new Date();
    //data source
  var selectedDates = [today.getDate() ];

  //Calendar with multiselection
  initCalendar($("#calendar").kendoCalendar(), selectedDates.slice());
});

function initCalendar(calendar, selectedDates, onUpdate) {
  var kendoCalendar = calendar.data('kendoCalendar');

  kendoCalendar.bind('navigate', function() {
    setTimeout(function() {
      updateCalendar(calendar, selectedDates);
    }, 0);
  });

  updateCalendar(calendar, selectedDates);

  calendar.on('click', function(event) {
    var cell = $(event.target).closest('td');
    var isClickedOnDayCell = cell.length !== 0 && isDayCell(cell);

    if (isClickedOnDayCell) {
      var date = dateFromCell(cell).getDate();
      var isDateAlreadySelected = selectedDates.some(function(selected) {
        return selected === date;
      });

      if (isDateAlreadySelected) {
        selectedDates.splice(selectedDates.indexOf(date), 1);

      } else {
        selectedDates.push(date);

listaZile.push(date); //this return days selected!!!
      }

      updateCell(cell, selectedDates);

      if (onUpdate !== undefined) {
        onUpdate();
      }
    }
  });
}


function updateCalendar(calendar, selectedDates) {
  calendar.find('td > a').parent().each(function(i, item) {
    var cell = $(item);

    if (isDayCell(cell)) {
      updateCell(cell, selectedDates);
    }
  });
}

function updateCell(cell, selectedDates) {
  var isCellSelected = selectedDates.some(function(selected) {
    return selected === dateFromCell(cell).getTime();
  });

  if (isCellSelected) {
    cell.addClass('selected');

  } else {
    cell.removeClass('selected');
  }
}

function isDayCell(cell) {
  return /^\d{1,2}$/.test(cell.find('a').text());
}

function dateFromCell(cell) {
  return new Date(convertDataValue(cell.find('a').attr('data-value')));
}

//convert from 'YYYY/MM/DD', where MM = 0..11
function convertDataValue(date) {
  var regex = /\/(\d+)\//;
  var month = +date.match(regex)[1] + 1;

  return date.replace(regex, '/' + month + '/');
}

P.S I attached a view of my calendar window. the get value from month selection is undefined.

Thank you.

1 Answer, 1 is accepted

Sort by
0
Preslav
Telerik team
answered on 26 May 2017, 11:04 AM
Hi Emanuel,

To get the month from the Kendo UI Calendar, I would suggest using the value method to get the date object and the getMonth method to get the month.
For example, please check this Dojo: http://dojo.telerik.com/iligE


Regards,
Preslav
Progress Telerik
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Tags
Calendar
Asked by
Emanuel
Top achievements
Rank 1
Answers by
Preslav
Telerik team
Share this question
or