Date format not applied throughout the control
When I set the date format on the Schedule control to "dd. MMM yyyy" it gets shown properly in the header datepicker but not in the timeline header. Am I missing something
Hi Thomas,
Based on your requirements, we recommend using the dateHeaderTemplate
to customize the date header format, as demonstrated in the code snippet below.
Please refer to the provided user guide and sample for further reference. We
encourage you to try it out.
[index.js]
|
import { extend, Internationalization } from '@syncfusion/ej2-base'; import * as dataSource from './datasource.json'; /** * schedule timeline resource grouping sample */ const TimelineGrouping = () => { let instance = new Internationalization(); const getDateHeaderText = (value) => { return instance.formatDate(value, { format: 'dd.MMM yyyy' }); }; const dateHeaderTemplate = (props) => { return (<div> <div>{getDateHeaderText(props.date)}</div> </div>); }; return (<div className='schedule-control-section'> <div className='col-lg-12 control-section'> <div className='control-wrapper'> <ScheduleComponent dateFormat="dd.MMM yyyy" dateHeaderTemplate={dateHeaderTemplate}> </ScheduleComponent> </div> </div> </div>); }; export default TimelineGrouping; |
DateHeaderTemplate UG: https://ej2.syncfusion.com/react/documentation/schedule/header-bar#using-date-header-template
dateHeaderTemplate api: https://ej2.syncfusion.com/react/documentation/api/schedule/#dateheadertemplate
Sample link: https://stackblitz.com/edit/react-yhv4zr-jmnj7s?file=index.js
Output screenshot:
Regards,
Vijay
Thanks, but that will also override the Month Timeline View dateheader where there's only space for the day number and not the whole date. any way to exclude this view?
