Initial sorting of grid not working

[melkorman]

Hi,

I have a simple grid defined like this:

<telerik:RadGridView Name="OrdersGridView" SelectionMode="Single" ItemsSource="{Binding PagedSource, ElementName=OrdersPager}" AutoGenerateColumns="False" ShowInsertRow="True" UseLayoutRounding="False" CanUserDeleteRows="False" RowEditEnded="OrdersGridViewRowEditEnded" AddingNewDataItem="OrdersGridViewAddingNewDataItem">
   <telerik:RadGridView.SortDescriptors>
        <telerik:SortDescriptor Member="Id" SortDirection="Descending" />
    </telerik:RadGridView.SortDescriptors>
    <telerik:RadGridView.Columns>
        <telerik:GridViewDataColumn DataMemberBinding="{Binding Id}" Header="{x:Static properties:Resources.Id}" UniqueName="Id" IsReadOnly="True" />
        <telerik:GridViewComboBoxColumn DataMemberBinding="{Binding status}" Header="{x:Static properties:Resources.Status}" UniqueName="Status" ItemsSource="{Binding Statuses}" SelectedValueMemberPath="Key" DisplayMemberPath="Value" />
        <telerik:GridViewDataColumn DataMemberBinding="{Binding SocialSecurityNumber}" Header="{x:Static properties:Resources.SocialSecurityNumber}" UniqueName="SocialSecurityNumber" />
        <telerik:GridViewDataColumn DataMemberBinding="{Binding VisitDate}" Header="{x:Static properties:Resources.VisitDate}" UniqueName="VisitDate" />
        <telerik:GridViewDataColumn DataMemberBinding="{Binding Department}" Header="{x:Static properties:Resources.Department}" UniqueName="Department" />
        <telerik:GridViewDataColumn DataMemberBinding="{Binding Information}" Header="{x:Static properties:Resources.Information}" UniqueName="Information" />
        <telerik:GridViewDataColumn DataMemberBinding="{Binding Recipient}" Header="{x:Static properties:Resources.Recipient}" UniqueName="Recipient" />
        <telerik:GridViewDataColumn DataMemberBinding="{Binding OrderDate}" Header="{x:Static properties:Resources.OrderDate}" UniqueName="OrderDate" DataFormatString="{} {0:yyyy-MM-dd}" />
        <telerik:GridViewDataColumn DataMemberBinding="{Binding OrderedBy}" Header="{x:Static properties:Resources.OrderedBy}" UniqueName="OrderedBy" />
        <telerik:GridViewDataColumn DataMemberBinding="{Binding ContactEmail}" Header="{x:Static properties:Resources.Email}" UniqueName="Email" />
        <telerik:GridViewDataColumn DataMemberBinding="{Binding ContactPhone}" Header="{x:Static properties:Resources.Phone}" UniqueName="Phone" />
        <telerik:GridViewDataColumn DataMemberBinding="{Binding DocumentId}" Header="{x:Static properties:Resources.DocumentId}" UniqueName="DocumentId" />
        <telerik:GridViewDataColumn DataMemberBinding="{Binding LoanDate}" Header="{x:Static properties:Resources.LoanDate}" UniqueName="LoanDate" DataFormatString="{} {0:yyyy-MM-dd}" />
        <telerik:GridViewDataColumn DataMemberBinding="{Binding LoanProcessedBy}" Header="{x:Static properties:Resources.LoanProcessedBy}" UniqueName="LoanProcessedBy" />
        <telerik:GridViewDataColumn DataMemberBinding="{Binding ReturnDate}" Header="{x:Static properties:Resources.ReturnDate}" UniqueName="ReturnDate" DataFormatString="{} {0:yyyy-MM-dd}" />
        <telerik:GridViewDataColumn DataMemberBinding="{Binding ReturnProcessedBy}" Header="{x:Static properties:Resources.ReturnProcessedBy}" UniqueName="ReturnProcessedBy" />
    </telerik:RadGridView.Columns>
</telerik:RadGridView>

<telerik:RadDataPager Grid.Row="1" Name="OrdersPager" Source="{Binding Path=Orders}" DisplayMode="First, Previous, Next, Last, Text" IsTotalItemCountFixed="True" />

The data is initiated like this:

Orders = new QueryableDataServiceCollectionView<Order>(ordersContext, ordersQuery) { PageSize = 20, AutoLoad = true };

When I add sorting to the grid (as seen in the xaml above) the grid on first load displays both the 20 orders that should be in the grid and the 20 orders that should have been in the grid if there was no initial sorting defined. When I step to the next page and then back again to the first page, only the 20 orders that should be in the grid remains.

So for instance, the orders in the grid on the first page might initialy be:
1, 2, 3, ..., 20, 100, 99, 98, ..., 81

But it should be:
100, 99, 98, ..., 81

Am I doing something wrong, or is this a bug?

Best regards
Linus

[Rossen Hristov]

Hello,

The problem comes from the fact that you have bound the grid to the PagedSource of the pager. With this configuration what happens is the following. The pager tells the QDSCV to bring back 20 recrods. What comes to the client, i.e. these 20 records "go out" of the pager and into the grid. The grid only sorts these 20 recrods on the client. It does not know about the QDSCV.

The correct configuration is the following.

If you bind both RadGridView.ItemsSource and RadDataPager.Source to the QDSCV at the same time, then the grid will "tell" the QDSCV to sort on the server and the pager will "tell" it to page on the server. Since it is clever, it will perform the server-side sorting BEFORE the paging and the correct data will come back to the client.

RadDataPager---(paging)--> QDSCV<--(sorting)--RadGridView
                                                   |
                                                   |
                                               Server

All of this is described in this article and this article and is show in our QSF example called RadDataServiceDataSource -> MVVM Support.

I hope this helps.

Regards,
Rossen Hristov
the Telerik team

[melkorman]

Thanks for the reply!

So, then it would look like this?

<telerik:RadGridView Name="OrdersGridView" SelectionMode="Single" ItemsSource="{Binding Path=Orders}" ...>

<telerik:RadDataPager Grid.Row="1" Name="OrdersPager" Source="{Binding Path=Orders}" .../>

Because that doesn't work, same problem :(

Regards
Linus

[Rossen Hristov]

Hello,

You are right. I will investigate this issue and let you know when I have more information.

Greetings,
Rossen Hristov
the Telerik team

[Rossen Hristov]

Hello,

I found the problem.

Since the QDSCV is created in the view model with AutoLoad=true, it will start loading immediately when it is "born". But we do not want this. We want it to load sorted data. But the grid is parsed and created later in time, i.e. it is bound the to the QDSCV later and that is when its SortDescriptors are transferred to the QDSCV. But when this happens it is still waiting for the original request to come back (i.e. the one without sorting) so it ignores this new request with sorting. The original "unsorted" request comes back a little later and you see unsorted data in the grid. If you start moving around the pages then sorting will be fine. 

So how to fix this? If you turn on AutoLoad after the QDSCV has received the SortDescriptors from the grid, then it will make its first trip to the server with this sorting information. Something like this:

<Window x:Class="NorthwindServiceClient.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
        xmlns:local="clr-namespace:NorthwindServiceClient"
        Title="MainWindow" Height="500" Width="1200">
    <Window.Resources>
        <local:MyViewModel x:Key="MyViewModel"/>
    </Window.Resources>
    <Grid DataContext="{StaticResource MyViewModel}">
        <Grid.RowDefinitions>
            <RowDefinition Height="*"/>
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>

        <telerik:RadGridView x:Name="radGridView"
                             Grid.Row="0"
                             ItemsSource="{Binding Customers}"
                             IsBusy="{Binding Customers.IsBusy}"
                             AutoGeneratingColumn="OnRadGridViewAutoGeneratingColumn"
                             ShowGroupPanel="False"
                             IsReadOnly="True">
            <telerik:RadGridView.SortDescriptors>
                <telerik:SortDescriptor Member="CustomerID" SortDirection="Descending" />
            </telerik:RadGridView.SortDescriptors>
        </telerik:RadGridView>

        <telerik:RadDataPager x:Name="radDataPager"
                              Grid.Row="1"
                              PageSize="10"
                              Source="{Binding Customers}"
                              DisplayMode="All"
                              IsTotalItemCountFixed="True"/>

    </Grid>
</Window>

And the important part:

using System;
using System.Linq;
using NorthwindServiceClient.NorthwindService;
using Telerik.Windows.Data;

namespace NorthwindServiceClient
{
    public class MyViewModel
    {
        private QueryableDataServiceCollectionView<Customer> qdscv;

        public MyViewModel()
        {
            var context = new NorthwindContext();
            var query = context.Customers;

            this.qdscv = new QueryableDataServiceCollectionView<Customer>(context, query)
            {
                PageSize = 20,
                //AutoLoad = true
            };

            this.qdscv.SortDescriptors.CollectionChanged += this.OnSortDescriptorsCollectionChanged;
        }

        private void OnSortDescriptorsCollectionChanged(object sender, System.Collections.Specialized.NotifyCollectionChangedEventArgs e)
        {
            this.qdscv.AutoLoad = true;
        }

        public QueryableDataServiceCollectionView<Customer> Customers
        {
            get { return this.qdscv; }
        }
    }
}

Of course you can extend that to filtering as well.

I have attached a sample project with this implementation.

Regards,
Rossen Hristov
the Telerik team

[melkorman]

Thanks! That did the trick.

Maybe this should go into the documentation?

Regards
Linus