Our pure JavaScript Scheduler component


Post by jungo »

Hi Bryntum team, I'm planning to do infinite scroll to load more data, but I am not able to find the 'onScrollEnd' event. Can you help me? Currently, I do the task like this, but it won't work on many other devices

          onScroll={(e: any) => {
            if (e.source.virtualScrollHeight - 700 - e.scrollTop < 250) {
              //function load more
            }
          }}

Post by tasnim »

Hi,
You can achieve it like this

Using our API

scheduler.on({ scroll() { if (scheduler.scrollable.y === scheduler.scrollable.maxY) { console.log('Reached end') }} });

Native DOM API

const element = scheduler.bodyContainer;
element.addEventListener('scroll', () => {
    if (element.scrollTop + element.offsetHeight === element.scrollHeight) console.log('bottom');
});

Docs :
https://bryntum.com/docs/scheduler/api/Scheduler/view/Scheduler#event-scroll

Attachments
chrome_HhXIUgKMq4.gif
chrome_HhXIUgKMq4.gif (244.64 KiB) Viewed 922 times

Post by Animal »

Probably best to use the loadDateRange event as here: https://bryntum.com/examples/scheduler/infinite-scroll/

You can see when you scroll, it shows a toast message when it hits the buffer and needs another date range.


Post by jungo »

@Animal, As I understand loadDateRange will work horizontally, I want to scroll vertically.


Post by tasnim »

Is your problem solved?


Post by jungo »

@tasnim Yes, thank you for helping :D


Post Reply