Our pure JavaScript Scheduler component


Post by marinovl7 »

Dear bryntum team,

I have a scheduler pro component implemented in Angular the following way:

This is the HTML Template

 <div class="scheduler-pro">
        <bryntum-scheduler-pro-project-model
            #project
            [calendars]="calendars"
            [resources]="resources"
            [events]="events"
            [assignments]="assignments"
        ></bryntum-scheduler-pro-project-model>

    <bryntum-scheduler-pro
        #schedulerpro
        [columns]="schedulerProConfig.columns"
        [startDate]="schedulerProConfig.startDate"
        [endDate]="schedulerProConfig.endDate"
        [features]="schedulerProConfig.features"
        [viewPreset]="schedulerProConfig.viewPreset"
        [project]="project"
        [taskEditFeature]="taskEditConfig"
        [tbar]="schedulerProConfig.tbar"
        [timeAxis]="schedulerProConfig.timeAxis"
    ></bryntum-scheduler-pro>
</div>

So as you can see the data I pass is obviously coming from the component.ts file and is not configured with a store. The data is fetched from the backend with normal HTTP Requests in the component.ts file and passed to the scheduler models. Also CRUD Operation are managed by utilizing listeners on the scheduler component and sending requests when event happens. We want to make use of the lazyLoading feature, however the documentation I read is mostly about using it with store and configuring it with store. Is there a way to implement and configure lazy loading in my case? Or we should refactor our current logic to make use of the store?

Best,
Lachezar


Post by joakim.l »

Hi!

Yes, you're right, to be able to use the lazy loading functionality you need to implement the requestData function on the Store(s), and provide the Store(s) with data when it's requested. Or, if possible in your app, you can use the Project's build-in CrudManager to do the HTTP requests for you.

How to do this in a non-framework way is all here, in this guide:
https://bryntum.com/products/scheduler/docs/guide/Scheduler/data/lazyloading

I see you're using Angular. I don't think we have any examples or code snippets regarding lazy loading, but it should be fully doable. We have a demo in React. Not completely applicable, but could be worth checking out: https://bryntum.com/products/schedulerpro/examples/frameworks/react-vite/infinite-scroll-crudmanager

Regards
Joakim


Post Reply