Our powerful JS Calendar component


Post by accounts@projul.com »

Hi, We have resources as projects, we want to show projects in groups like "Active Projects" etc in Bryntum calendar control. Some projects should not be the part of any group.

Attachments
calendar_resource_grouping.png
calendar_resource_grouping.png (71.33 KiB) Viewed 404 times

Post by marcio »

Hello accounts@projul.com,

You can achieve that behavior with the following snippet (please update for the field that you're using to group the resources)

group : {
	field : 'project',
	// Renderer used when grouped by a column that does not define its own groupRenderer.
	// Applied to all cells, whereas a column specific renderer is only used for the first column.
	renderer({ groupRowFor, record, size }) {
		if (record.meta.groupField === 'project' && groupRowFor === 'No project') {
			size.height = 0;
		}
	}
}

More information about the renderer (with other options that you could use to find the "No project" header element)
https://www.bryntum.com/docs/calendar/api/Grid/feature/Group#config-renderer

Best regards,
Márcio


Post by accounts@projul.com »

Hi @marcio, Can we use this group feature with calendar control? When i pass the config to BryntumCalendarControl features config, it throws the error 'Invalid type name "group" passed to CalendarFeature factory'
What i have done is used the group function of the resourceStore that shows the groups in resources column, but there are two issues with it

  1. Group Headers are showing first & all resources of those headers showing at last, instead of showing like
    Group1
    Resource1 of group1
    Resource2 of group1
    Group2
    Resource1 of group2
    Resource2 of group2
    This is how resources column is showing up
    Group1
    Group2
    Resource1 of group1
    Resource2 of group1
    Resource1 of group2
    Resource2 of group2
  2. Clicking on the group header should expand or collapse the group but it actually check/uncheck the resources of that group
Attachments
s1.png
s1.png (72.14 KiB) Viewed 384 times
s2.png
s2.png (10.75 KiB) Viewed 384 times

Post by Animal »

Grouping is a Grid feature.

Your original image showed the Grid view of events.

The widget in the sidebar is a List. That does not support special rendering for groups. Obviously, you can sort the data, but List is a very simple widget.


Post by accounts@projul.com »

So is there any hack to achieve the tree view with expand collapse on resources column in sidebar?
If no then i am thinking to remove entirely the default resource column rendered by bryntumcalendarcontrol. And embed my own html view and handle all events programmatically. Can you give me direction on it if this is something that can be doable.


Post by marcio »

You could try to use our TreeGrid component and customize it as you like with the available options described here https://www.bryntum.com/docs/calendar/api/Grid/view/TreeGrid

Best regards,
Márcio


Post by marcio »

You can create that custom component (using TreeGrid or your custom html view) and then add to the sidebar configuration, check it here https://www.bryntum.com/docs/calendar/api/Calendar/widget/Sidebar

And here's how to create custom Widgets https://www.bryntum.com/docs/calendar/guide/Core/advanced/widgets

Best regards,
Márcio


Post Reply