kendo-multi-calendar

Extended Kendo UI Calendar widget that supports multiselection. Demo

Installation

npm i kendo-multi-calendar

kendo-multi-calendar(.min).js script should be included in your project along with kendo-ui-core or kendo-ui.

Usage

var multiCalendar = $("#multiCalendar").kendoMultiCalendar({
    // use 'values' option instead of 'value',
    // defaults to []
    values: [new Date(), new Date(2016, 5, 2)], 
 
    // set selection limits, 
    // defaults to null - no limit
    maxSelectedItems: 3,
 
    // if true - only today date will be selected after click on date in footer,
    // if false - today date will be added to selected dates,
    // defaults to true
    cleanSelectedItemsOnTodayClick: false,
 
    //... everything else is just like in ordinary Kendo UI Calendar
}).data('kendoMultiCalendar');
 
multiCalendar.values([]);

Typescript

This module also contains type declarations.

// use 'reference' directive
/// <reference path="node_modules/kendo-multi-calendar/dist/kendo-multi-calendar.d.ts" />
 
// or add types to 'compilerOptions' in your tsconfig.json:
// ...
// "types": [ "kendo-multi-calendar" ],
// ...
 
const calendar = new kendoExt.MultiCalendar('#multiCalendar');