Option to disable the tab in kendo datetimepicker

[Utsav]

Hello, I would like to disable the tab in the date timepicker but i could not find any options to pass in the kendo-datetimepicker component


and maybe replace it with something else. Something like this:

Can you please tell me if it is possible?

[Martin Bechev]

Ho Utsav,

The DateTimePicker doesn't provide a built-in option to disable the Date/Time button group. But the developer can manually add the CSS utility class 'k-disabled' to the button group, using some custom custom JavaScript code inside the open event hander of the component:

  onOpened() {
    setTimeout(() => {
      const btnGroup = document.querySelector('.my-dp .k-datetime-buttongroup');
      btnGroup.classList.add('k-disabled');
    });
  }

Here is an example:

https://stackblitz.com/edit/angular-3vqscc?file=src%2Fapp%2Fapp.component.ts

I hope this helps.

[Utsav]

Hello Martin, Thank you for your response. Is there a template to replace the date/time as well? And i would like to replace the whole body as well 

Is it possible is there a template for this?

One template to replace the tabs (date/time) another template to replace the body calendar.

[Martin Bechev]

Hi Utsav,

There are no such templates.

The following article demonstrates the templates that the DateTimePicker supports:

https://www.telerik.com/kendo-angular-ui/components/dateinputs/datetimepicker/templates/

Regards.