This is a migrated thread and some comments may be shown as answers.
Dynamic loading on scroll...anyone done it?
10 Answers 133 Views
This is a migrated thread and some comments may be shown as answers.
Josh Anderson
Top achievements
Rank 1
Josh Anderson asked on 02 Aug 2008, 06:45 PM
This is half feature request and half a question for other telerik users out there -- has anyone successfully implemented a scroll-based loading process for radGrid?  I'm not sure what the exact terminology is, but it's how Google Reader loads articles.  When you get to a certain scoll point, it will load additional posts in the background.  I've seen implementations of this before, but nothing with a grid control.

It would be a great way to use radGrid since paging can sometimes be a pain.  What would be great is if it were embedded in the control -- set a point at which an AJAX event would fire requesting additional data and passing info about where in the data set you are.  Sort of like custom paging, only the grid would append the added data to the bottom of the list rather than changing the page.  I sort of think this has to be a telerik-implemented thing to really be efficient, since rebinding the grid, even via AJAX, negates the partial-rendering efficiency of this model as a replacement for a paging model.

Josh

10 Answers, 1 is accepted

Sort by
0
Shinu
Top achievements
Rank 1
answered on 04 Aug 2008, 06:22 AM
Hi Josh,

Have you gone through the following online demo?
Virtual scrolling and paging

Regards
Shinu.
0
Josh Anderson
Top achievements
Rank 1
answered on 04 Aug 2008, 12:50 PM
Yes, I've seen that but it's nowhere near as elegant as the other solutions I've seen.  Google Reader is a perfect example -- the loading of additional data truly happens in the background, with no "Loading..." panels, no disappearance of data, nothing to tell the user that more data is being loaded other than the fact that the scroll bar changes size.

For example, say you have a data set of 10,000 records.  What I envision is a datagrid that you could load with, say, 100 records.  As you scroll down, at about record number 50 an AJAX request is triggered truly in the background.  The results of that request are then appended to the end of the rows in the grid, making the grid now have 200 records.  As you continue to scroll to record 150, another request is triggered and the grid is grown to 300 records.  There are no pages listed at the bottom, because this isn't a paging model.  It's a dynamically loaded grid so that at the end of it, if you continued scrolling all the way to the end, you'd have all 10,000 records visible in the grid (an extreme example, but you get the point).

What I don't like about the demo is that if you scroll down, the data disappears and you get a "Loading..." image, then another page of data.  It's not smooth and really is just using a vertical scroll bar to scroll through pages, not records.

Josh
0
Yavor
Telerik team
answered on 05 Aug 2008, 05:51 AM
Hello Josh,

Another example that you may find worthwhile reviewing is the following one. Other than the loading panel (which can easily be removed) there is no other disturbance telling the end user that more items are being loaded - only the vertical scrollbar changes size.

Kind regards,
Yavor
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
0
S
Top achievements
Rank 1
answered on 28 Jan 2010, 04:14 PM
I want to second this request.  I tried looking at the example that was provided, but when I scrolled to the end, it threw an error!

http://demos.telerik.com/aspnet-ajax/grid/examples/programming/webmailgrid/defaultcs.aspx


0
Yavor
Telerik team
answered on 03 Feb 2010, 06:14 AM
Hello S,

I double-checked the example, and it behaved as expected.
Can you please let me know what browser you are using, as well as any other relevant data, such as the steps which you took in order to receive this exception.

Greetings,
Yavor
the Telerik team

Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
Follow the status of features or bugs in PITS and vote for them to affect their priority.
0
S
Top achievements
Rank 1
answered on 03 Feb 2010, 06:27 AM
I just checked and it is also working for me now.  Not sure what caused the error before.
0
Danyal Rashid
Top achievements
Rank 1
answered on 24 Jun 2010, 09:46 PM
I checked all the examples and I don't think these examples are what the original post is talking about.

Have a look at this example
http://archive.dojotoolkit.org/nightly/dojotoolkit/dojox/grid/tests/test_grid.html




Is it possible to configure RadGrid in this way? At the least, it would be nice to not lose the scroll click as the user changes the page. Currently, as soon as the new page is loaded, we lose the scroll click, can not continue scrolling, and have to re-click on the scroll bar to continue.

Can it load the new page in the background so the user can continue to scroll?
 
0
Veli
Telerik team
answered on 30 Jun 2010, 12:13 PM
Hello Danyal,

Consider the RadGrid Virtual Scrolling with Client-side DataBinding demo. RadGrid supports virtual scroll paging with client-side databinding, and, as only the data rows are updated and not the entire RadGrid container, you get to keep the scroll bar pressed.

The Dojo grid example also demonstrates client-side databinding. When the grid container is not refreshed and the HTML inside is not recreated, you can keep the scroll bar pressed. There is no way you can have AJAX-postbacks and still keep the scroll bar pressed, because the content is refreshed.

All the best,
Veli
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
0
Danyal Rashid
Top achievements
Rank 1
answered on 30 Jun 2010, 02:18 PM
This is exactly what I was looking for, thanks for pointing me to it.

The link you provided Grid / Virtual scrolling with client binding works great in Firefox. But I cannot get to keep the scroll bar pressed in IE7. I am only interested in Virtual scrolling and paging with client-side data binding example (not the yahoo style)
 
Thank you for your support.

0
Veli
Telerik team
answered on 01 Jul 2010, 09:38 AM
Hello Danyal,

Confirmed, scroll bar is not kept pressed in IE7 and Opera, due to the change in the DOM subtree inside the scrollable data container. RadGrid currently updates the table rows and adjusts the scroll position after paging.

Sincerely yours,
Veli
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
Tags
Grid
Asked by
Josh Anderson
Top achievements
Rank 1
Answers by
Shinu
Top achievements
Rank 1
Josh Anderson
Top achievements
Rank 1
Yavor
Telerik team
S
Top achievements
Rank 1
Danyal Rashid
Top achievements
Rank 1
Veli
Telerik team
Share this question
or