Start the week view with the current date

Question

Can we show the week view of the calendar to start with the current day instead of Sunday?

Vijay Ravi · Accepted Answer

Hi Naveen,Based on your requirement, we have modified our shared
sample by adding resource grouping. We suggest setting the timelineDay
view and timescale
property to false to achieve your requirement, as shown in the below shared
code snippet. Refer the below shared sample for your reference.[Index.js]

views: [
              { displayName: 'Week', option: 'TimelineDay', interval: 7 },
              { displayName: '4 Months', option: 'Month', interval: 4 }
          ],
          group: { resources: ['Owners'] },
          timeScale: {
           enable: false,
          },
          resources: [{
              field: 'OwnerId', title: 'Owner',
              name: 'Owners', allowMultiple: true,
              dataSource: [
                  { OwnerText: 'Nancy', Id: 1, OwnerColor: '#ffaa00' },
                  { OwnerText: 'Steven', Id: 2, OwnerColor: '#f8a398' },
                  { OwnerText: 'Michael', Id: 3, OwnerColor: '#7499e1' },
                  { OwnerText: 'Clarke', Id: 1, OwnerColor: '#ffaa00' },
                  { OwnerText: 'Benjamin', Id: 2, OwnerColor: '#f8a398' },
                  { OwnerText: 'Smith', Id: 3, OwnerColor: '#7499e1' }
              ],
              textField: 'OwnerText', idField: 'Id', colorField: 'OwnerColor'
          }],

Sample: https://stackblitz.com/edit/setting-current-date-as-first-instead-of-sunday-a8ynym?file=index.jsOutput screenshot:Please get back to us if you need any further assistance.Regards,Vijay

Vijay Ravi · Answer

Hi Naveen,
 Based on your requirement to show the week view of the
calendar starting with the current day instead of Sunday, we prepared the
Schedule sample using the Day view. Additionally, we set the interval as
7 days and the displayName as "Week" to achieve your
requirement, as shown in the below shared code snippet. Refer to the below
shared sample for your reference.displayName property api: https://ej2.syncfusion.com/javascript/documentation/api/schedule/views/#displaynameInterval property api: https://ej2.syncfusion.com/javascript/documentation/api/schedule/views/#interval[Index.js]

views: [
             
  { displayName: 'Week',  option: 'Day',  interval: 7 },
             
  { displayName: '4 Months', option: 'Month', interval: 4 }
  ],

Sample: https://stackblitz.com/edit/setting-current-date-as-first-instead-of-sunday-rcbngo?file=index.jsOutput screenshot:Please get back to us if you need any further assistance.Regards,Vijay

Naveen Davuluri · Answer

Hi Vijay, thanks for the prompt response. Help provided is fantastic. I added this to my code but the resources are showing in the top. I don't need the hours on the left. Original