Indeed there is no straight forward approach to change the layout of the built-in date picker filter, rather than a custom one needs to be implemented in a kendoGridFilterCellTemplate and manually handle the filtering functionality:
<ng-template kendoGridFilterCellTemplate let-filter let-column="column">
<my-datepicker-filter [filter]="filter" [field]="column.field">
<my-datepicker-filter> is a custom component where Kendo Angular DatePicker component is defined with the discussed template for the navigation part.
In order to function as the default date filter, the operators need to be added as well, utilizing FilterCellOperatorsComponent. Please check the following StackBlitz that demonstrates the suggested approach in more details:
I understand that the logic of the example gets more complex with the only aim to change the DatePicker navigation, but this is the way to go.
Let me know if I can assist any further.
Progress is here for your business, like always. Read more
about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.