RadGrid Virtual scrolling and paging

[Jason]

Hi,

I am trying to implement the example shown in your Asp.NET/Ajax (http://demos.telerik.com/aspnet-ajax/grid/examples/client/virtualscrollpaging/defaultcs.aspx) in my Silverlight5 application.

Do you have any example solutions in Silverlight which explain how to implement the demos which are shown in asp.net/ajax section

1. Virtual scrolling and paging : Drag the vertical scroll and release it to navigate to the desired page
2. Yahoo style scrolling : Drag the vertical scroll and release it to navigate to the desired page

Note: I am getting data from third party WCF service and i don't know how many records are sitting in the thirda party site.

Thanks.

Yahoo-style scrolling:

Yahoo-style scrolling:

Yahoo-style scrolling:

Yahoo-style scrolling:

[Rossen Hristov]

Hello,

The closest solution that we have for Silverlight is called the VirtualQueryableCollectionView. In your local installation of our Quick Start Framework, you can find examples under the "Data Virtualization" section.

Kind regards,
Rossen Hristov
the Telerik team

[Jason]

Hi Rossen,

Thank you for your response. DataVirtualization demo which is provided on your website will not work for my scenario.
My problem is i am not having any control on the data which is pushed from thirdparty WCF service.

Question1:

I am planning to implement the following steps to implement On-Demand scrolling on the grid.

Step1: Get some records lets day (100 records) from the third party service and populate a collection which is tied to the grid (in MVVM)
Step2: When user start scrolling the records and when the grid display last record i need to call the third party WCF service to give me next set of 100 records. (My question is can i bind any property of radgrid which will tell if the grid is displaying last record when user hit the last record).
Note: i am not using code behind so i cannot take advantage of the events which are available.

Question 2:

Since i have only limited set of data in  my collection lets say (100 records or 200 records) and these records will be added to the collection based on the need. can i use VirtualQueryableCollectionView. to implement datavirtualization of the existing set records.

In short my datacontext will be a observable collection. Do you have any sample example which explain how to implement datavirtualization using observable collection as datacontext ?

Thanks.

[Rossen Hristov]

Hello,

Straight onto your questions:

1. I am afraid that RadGridView does not have such a property.

2. The only way to implement data virtualization is by using the VirtualQueryableCollectionView as in the example I mentioned. ObservableCollections are not virtual. Of course, RadGridView will respond to any CollectionChanged events coming from an ObservableCollection if it is its ItemsSource. RadGridView is just an ItemsControl like any other, i.e. ListBox, the stock DataGrid and so on. It has not intrinsic knowledge about its ItemsSource -- it simply listens for CollectionChanged events from its ItemsSource. The virtualization is done by the VQCV and RadGridView has absolutely no clue.

There is something which I cannot understand though. First you say that the third party WCF Service will be pushing data to you and that is why you cannot use the VQCV. The next thing you say is that you will pull data on demand which is exactly what the VQCV was created for.

I hope this helps.

Greetings,
Rossen Hristov
the Telerik team

[Jason]

Hi Rossen,

Thank you for your reply. It seems i am not having any other options to implement virtual scrolling instead i am moving towards datapager control.

I need your help to resolve my issue which i am having with the data pager control.

I have a data pager with display mode is "FirstLastPreviousNextNumeric" in MVVM pattern.
I have binded dataPager "PageIndex" property to my viewModel (My view model will get the current page number when ever user navigate through other pages) When user visit last available page on the grid i am calling the WCF service to give me few more set of records which is working fine.

My question is how can i know if the user is navigating other pages by clicking on
1. Each page number
2. Previous/Next button.
3. First/Last button

Following is my requirement.
1. When user click on page numbers to navigate i will get page number from the "PageIndex" property. in this way i will know if user is accessing last page so that i can call the WCF service to get additional data. (This case is working for me now)
2. When user click on previous or next button i still get the page number from the "PageIndex" property. in this way i will know if user is accessing last page so that i can call the WCF service to get additional data. (This case is working for me now)
3. When user click on Last button i need to loop through the WCF call to get all data. How can i know if user has clicked on First/Last button is there any property or events for this button?

Thanks.

[Rossen Hristov]

Hello,

RadDataPager (just like the stock Silverlight DataPager) has all kinds of events and properties:

Events:
- PageIndexChanging
- PageIndexChanged

Properties:
- PageCount
- PageIndex
- PageSize

The user has clicked on the first button if PageIndex is zero. The user has clicked on the last button if PageIndex is PageCount -1.

There are three ways to achieve your goals.

1. You can use the commands that RadDataPager exposes and use them to get your data from the service. The available commands can be found in the class RadDataPagerCommands.

2. You can use the pager in its Unbound Mode which is the best in my opinion. You will have total control to set the number of pages, etc. Then you only subscribe to the events and pull what data is needed.

3. You can implement the IPagedCollectionView interface and bind RadDataPager to it. RadDataPager will honor this contract and work with the IPagedCollectionView interface when the user is clicking around.

I hope this helps.

Greetings,
Rossen Hristov
the Telerik team

[Jason]

Hi,

Do you have an sample example or code snipet to use DataPager Commands?

Thanks.

[Rossen Hristov]

Hi,

Using the command would involve re-templating the entire XAML of the control to use your view model which is very complex. Basically you would have to extract all the XAML and find the buttons and plug your view model commands there. Since the numeric buttons are generated dynamically, this would be almost impossible.

The easiest approach would be to implement the IPagedCollectionView interface and feed it to RadDataPager.Source. The IPagedCollectionView has these methods:
MoveToFirstPage
MoveToLastPage
MoveToNextPage
MoveToPage
MoveToPreviousPage

These methods will be called when the user clicks the respective buttons and you will know what he is doing.

Your class implementing the IPagedCollectionView should also be an IEnumerable and an INotifyCollectionChanged.

The default Microsoft implementation of this interface is called PagedCollectionView and you can examine it with reflector.

I have a much simpler dummy implementation which you can modify to suit your needs. You can take it and start tailoring it to your real project, since this is a dummy implementation which returns data endlessly. Please, find it attached.

Basically here is what you need to do:

1. The user does something, i.e. MoveToNextPage method on you implementation is called.
2. You do what you need to do in order to get the data from the service.
3. You fire CollectionChanged.Reset so the rest of the world can get your implementaiton's Enumerator and enumerate the new data. If it would be easier for you you can make your class inherit from ObservableCollection and simply Clear it when the user moves to a different page and then add the new items to it.

Implementing the IPagedCollectionView interface is really beyond the scope of Telerik support since this is a standard Silverlight interface. Both the stock Silverlight pager and our RadDataPager will work with this interface in exactly the same way. So anything you can achieve with the stock pager, you should be able to achieve with our pager by simply interchanging them.

This blog post provides another implementation of the IPagedCollectionView interface. There are a couple others on the web. But the best source is reflecting Microsoft's default implementation called PagedCollectionView to see how they implement their own interface. It might be possible to just sub-class their PagedCollectionView and hack it so it does your thing, but I have never tried this. As long as you have a proper IPagedCollectionView implementation -- both pagers will work nicely with it by calling its MoveTo* methods.

I hope this helps.

Greetings,

Rossen Hristov
the Telerik team