All Components

Focused and Selected Dates

The Calendar enables you to handle the configuration of its focused and selected dates, and control the partial date selection.

Focused Dates

The Calendar always displays a focused date and, by default, the focused date is today's date. To change the focused date, use the focusedDate property by setting it to a specific Date value. The Date value has to be a valid JavaScript Date object.

@Component({
selector: 'my-app',
template: `
<kendo-calendar [focusedDate]="focusedDate"></kendo-calendar>
`
})
class AppComponent {
    public focusedDate: Date = new Date(2010, 10, 10);
}

Selected Dates

By default, the selected date is not set and the Calendar displays only the focused date. To define the selected date, use the value property.

@Component({
selector: 'my-app',
template: `
<kendo-calendar [value]="value"></kendo-calendar>
`
})
class AppComponent {
    public value: Date = new Date(2010, 10, 10);
}
In this article