Unplanned
Last Updated: 31 Mar 2021 13:16 by ADMIN
Krishna
Created on: 29 Mar 2021 22:30
Category: KendoReact
Type: Feature Request
2
Infinitescrolling on Comobox

Hi Team,

 

We are trying to implement infinite scrolling for server data to our combobox based on virtual.

Do you have any event in combobox to handle on scroll.

 

Please help us with any examples you have on this topic. preferably using hooks.

6 comments
ADMIN
Stefan
Posted on: 31 Mar 2021 13:16

Hello, Krishna,

I already transferred it and added your vote for convenience. 

As the author of the request, you will receive a notification when it is ready.

Regards,
Stefan
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Krishna
Posted on: 31 Mar 2021 12:51

Hi Stefan,

Please transfer this feature request. and notify us when this feature become available.

 

Thanks,

Krishna.

ADMIN
Stefan
Posted on: 31 Mar 2021 04:53

Hello, Krishna,

The Grid infinite scrolling is based on the onScroll event of its containers which is very different from virtual scrolling.

Both types of scrolling a very different and currently the ComboBox supports only virtual scrolling.

If you wish I can transfer this ticket to an official feature request for infinite scrolling for the ComboBox. This will be done by exposing the onScroll event similar to how it is done in the Grid.

Regards,
Stefan
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Krishna
Posted on: 30 Mar 2021 22:35

I see scroll bar height on combox is set based on virtual total.

If I limit the virtual total to my page size of 20. pagechage event is not triggered as it is thinking total is already reached.

If I add virtual total to my total from server scroll bar is too small to handle below logic.

So I cannot apply my logic of infinite scrolling in pagechnage

e.nativeEvent.target.scrollTop + 10 >
      e.nativeEvent.target.scrollHeight - e.nativeEvent.target.clientHeight

 

I assume it is better if I have a scroll event on comobox. otherwise please provide an example how the above scenario can be implemented with virtual using hooks.

 

Thanks,

Krishna

Krishna
Posted on: 30 Mar 2021 13:43

Hi Stefan,

I'm looking for infinite scroll as in Kendo react grid, where we have on scroll event to handle page change.

This is added to the same page change event in kendo comobo. I'm looking for an example of that.

Thanks,

Krishna.

ADMIN
Stefan
Posted on: 30 Mar 2021 06:07

Hello, Krishna,

I can suggest checking our example of the ComboBox with virtualization:

https://www.telerik.com/kendo-react-ui/components/dropdowns/combobox/virtualization/

The example is with local data, but the same approach can be used for server data to make requests while scrolling.

The loading props can also be used in this case to indicate the loading of the data:

https://www.telerik.com/kendo-react-ui/components/dropdowns/api/ComboBoxProps/#toc-loading

I also made the same example using hooks:

https://stackblitz.com/edit/react-nhstyz?file=app/main.jsx

I hope this is helpful.

 

Regards,
Stefan
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.