> For the complete documentation index, see [llms.txt](https://docs.gapvelocity.ai/webmap/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.gapvelocity.ai/webmap/general/frontend/documentation/webforms-angular-components/ajax-web-components/ajaxcalendar.md).

# AjaxCalendar

Adds support for the ajaxToolkit:CalendarExtender.

It provides client-side date-picking functionality with customizable date format in a popup control.

## **Implementation Details:**

**Component Selector:** ‘wm-ajax-calendar’

**Kendo UI Component:** [<mark style="color:red;">Kendo DatePicker</mark>](https://www.telerik.com/kendo-angular-ui/components/dateinputs/datepicker/)

## Class inheritance

AjaxCalendarComponent extends [<mark style="color:red;">ControlComponent</mark>](/webmap/general/frontend/documentation/winforms-angular-components/web-components/base-components/control-component.md)<br>

## PME Support

### Custom Methods

#### Toggle

The ClickEmittedNotification subscription using the AjaxInteractionService helps to validate if it needs to toggle the calendar.

The toggle to show the calendar is called when the **click event Id** is the same as the ajax-calendar **popupButton Id**.

#### Reference to the complete control documentation: [<mark style="color:red;">AjaxCalendarComponent</mark>](https://docs-frontend.azurewebsites.net/WebFormsComponents/components/AjaxCalendarComponent.html)