Change count on headr of group column

[Arturo Martinez]

I have a calculation on dataBound event in my scheduler that calculates the total number of events on each day on each column and displays it on the group column, what i need to do is to count the empty rooms instead of the total of events on each day

on Agust 10 it says i have 3 events but i would need to be showing 0 since theres no room for more events that day, on Agust 11 i have one event and it displays it on the grouped header, for this day i should be displaying

[Vijay Ravi]

Hi Arturo,
 

Thanks for reaching out to us.

To show the count of cells without an appointment, you need to know the total number of child resources for each room. Then, for each cell, you can subtract the number of events from the total number of child resources to get the number of child resources without an appointment.

This below shared code will show the number of child resources without an appointment for each day in each column. The total number of child resources is calculated dynamically based on the categoryDataSource array and the groupId of the current cell.

[app.component.ts]

public onDataBound() {

    const workCells = document.querySelectorAll(".e-work-cells.e-resource-group-cells");

    workCells.forEach((cell, index) => {

        let projectEvents = [];   

        const timestamp = Number(cell.getAttribute('data-date'));

        const startDate = new Date(timestamp);

        const endDate = new Date(startDate);

        endDate.setDate(startDate.getDate() + 1); // add one day

        const events = this.scheduleObj.getEvents(startDate, endDate);

        const cellProjectId = this.scheduleObj.getResourcesByIndex(Number(cell.getAttribute("data-group-index"))).groupData.ProjectId;       

        events.forEach(event => {

            if (event.ProjectId === cellProjectId) {

                projectEvents.push(event);

            }

        });

        const totalChildResources = this.categoryDataSource.filter(category => category.groupId === cellProjectId).length;

        const emptyChildResources = totalChildResources - projectEvents.length;

        (cell as HTMLElement).innerText = emptyChildResources.toString();

    });

  }

Sample Link: number-of-events-with-resources (forked) - StackBlitz

Output screenshot:

Don't hesitate to get in touch if you require further help or more information.

Regards,

Vijay