Our powerful JS Calendar component
We are using the Bryntum Calender component for a custom timecard app for our employees. Thus far the functionality is great and using the component has saved us so much time. We have a few outstanding feature request from our users and I was hoping to ask the forum for some guidance on these issues.
Users are asking for the ability to multi select events to run custom action menu operations on the selected items. For example they want to select a days worth of events and delete them with fewer clicks. Is this possible?
Related to the last question they also want to select multiple events and slice an 8 hr event with multiple overlapping break or meal events. It would be nice if a built in operation to slice events existed to help mitigate overlapping events. If not I guess we will add a custom menu item to perform this operation to our data in the database then refresh the component. However it would be restricted to a single selection of our large 8hr event.
It's supported: https://www.bryntum.com/docs/calendar/api/Calendar/view/Calendar#config-multiEventSelect
Related to the last question they also want to select multiple events and slice an 8 hr event with multiple overlapping break or meal events. It would be nice if a built in operation to slice events existed to help mitigate overlapping events. If not I guess we will add a custom menu item to perform this operation to our data in the database then refresh the component. However it would be restricted to a single selection of our large 8hr event.
Can you please elaborate a bit on this?
Thank for the confirmation on mult select. Regarding slicing. Let me elaborate. We are trying to find a way for users to log breaks with less touch to the calendar. I see a few different approaches to solving our issue.
Users add what ever events they need for work time and or break time. We add an action menu item to operate on multiple selected events. Any overlapping meal events would slice away work time.
We add an action menu item that requires the selection of a single event where a user would like to inject a meal break. The tool takes the supplied event and injects a meal break event in the middle which in turn divides up the original select event into two separate work time events that bookend the new break event.
Im open to other solutions. The goals is to have bi-weekly (pay period) events with no overlapping events filled with proper meal breaks that align to local work policies.
By chance do any of the demos use the multi select argument? We tried wiring it up and it did not seem to work. A demo or a code pen example would help a bunch.
Its as simple as this:
You see the source panel at the right. multiEventSelect : true
. And in the Calendar implementation of the menu's handler (Called toggleAllDay
in this example), process this.selectedEvents
(this
will be the Calendar if you configure the method into the calendar like the examples do)
Then CMD+click (or CTRL+click if on Windows) multiple events:
- Screenshot 2022-11-24 at 18.37.07.png (439.32 KiB) Viewed 619 times
You can see the selected events looking bolder there.