This article showcases the integration of a ScheduleJS component into an external Ag-Grid table, to demonstrate the flexibility of ScheduleJS.
We have identified some cases where companies developing a scheduling component with ScheduleJS already use an in-house or a third-party-developed table. We decided to work on this proof of concept project to demonstrate a scenario where our users opt to leverage their actual solution and make their ScheduleJS application integrate seamlessly into their environment. The key to this approach is to be able to reuse the features a company spent time developing.
In ScheduleJS, the tree table is a component often placed at the left of the graphics. Its role is to offer the end-user additional information on a given row and provide tools to interact with the data. ScheduleJS proposes a standard integrated tree table component in which you can customize the column headers and row cells to create the perfect layout for your end users. This standard info-column API aims to empower the developer with a simple yet powerful tool to cover most of the use cases a company can encounter in a scheduling application.
Can we reach the same usability while hosting the ScheduleJS graphics as a child to an external table component?
Graphics present complex data into a readable output so the user can quickly gather information and interact with a descriptive graphical view. It is common for a web application to use a table component at the core of its architecture.
AG-Grid has been identified by our developers as a good candidate for this exercise, as a consistent pool of companies use this component to develop their tables.
For this implementation, we decided to pick the open-source version of the AG-Grid table component, which is royalty-free, even in the event of a commercial project.
The video below shows its features in our development environment:
The resulting additional features compared to a default tree table are the following: