Silverlight Checkbox inside datagrid causing problems

Hi everyone, I am facing an issue with checkboxes inside datagrid.

First let me post my code of what I have achieved and then I will explain what is causing the problems

This is the code of my datagrid inside child window

<Controls:DataGrid x:Name="dgAthlete" Height="Auto" Width="Auto"
                                       IsReadOnly="True" AutoGenerateColumns="False"
                                       HorizontalAlignment="Stretch"
                                       HorizontalScrollBarVisibility="Disabled"
                                       ItemsSource="{Binding Data, ElementName=dds}"
                                   >
            <Controls:DataGrid.Columns>
                <Controls:DataGridTemplateColumn Header="CheckBoxColumn">
                    <Controls:DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <CheckBox  x:Name="cbAddAthlete"  IsChecked="{Binding IsAdded}" Tag="{Binding}"
                            IsEnabled="True" Checked="cbAddAthlete_Checked" Unchecked="cbAddAthlete_Unchecked" />
                        </DataTemplate>
                    </Controls:DataGridTemplateColumn.CellTemplate>
                    <Controls:DataGridTemplateColumn.CellEditingTemplate>
                        <DataTemplate>
                            <CheckBox IsChecked="{Binding Path=IsAdded,Mode=TwoWay}"/>
                        </DataTemplate>
                    </Controls:DataGridTemplateColumn.CellEditingTemplate>
                </Controls:DataGridTemplateColumn>



                <Controls:DataGridTemplateColumn>
                    <Controls:DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <Image Source="{Binding ImageFileName}"
                                                Width="25" Height="25"
                                                HorizontalAlignment="Stretch" />
                        </DataTemplate>
                    </Controls:DataGridTemplateColumn.CellTemplate>
                </Controls:DataGridTemplateColumn>
                <Controls:DataGridTextColumn Header="FirstName" Binding="{Binding FirstName}" />
                <Controls:DataGridTextColumn Header="MiddleName" Binding="{Binding MiddleName}"/>
                <Controls:DataGridTextColumn Header="LastName" Binding="{Binding LastName}"/>
                <Controls:DataGridTextColumn Header="Email"  Binding="{Binding Email}" />
                <Controls:DataGridTextColumn Header="DOB" Binding="{Binding BirthDate}"/>
                <Controls:DataGridTextColumn Header="Phone" Binding="{Binding PhoneNumber}"/>
                <Controls:DataGridTextColumn Header="Website" Binding="{Binding WebSite}"/>
                <Controls:DataGridTextColumn Header="Team" Binding="{Binding TeamName}"/>
                <Controls:DataGridTextColumn Header="Club" Binding="{Binding ClubName}"/>
                <Controls:DataGridTextColumn Header="County" Binding="{Binding CountyName}"/>
            </Controls:DataGrid.Columns>
        </Controls:DataGrid>
        <Controls:DataPager x:Name="dpAthlete" PageSize="4"
                 HorizontalAlignment="Stretch" Source="{Binding Data, ElementName=dds}"
                 Width="Auto"/>
    </StackPanel>
    <Button x:Name="CancelButton" Content="Cancel" Click="CancelButton_Click" Width="75" Height="23" HorizontalAlignment="Right" Margin="0,12,0,0" Grid.Row="1" />
    <Button x:Name="OKButton" Content="OK" Click="OKButton_Click" Width="75" Height="23" HorizontalAlignment="Right" Margin="0,12,79,0" Grid.Row="1" />

      

        
        
        
      

    

The code for this is -

public partial class AddAthletesToCompetition : ChildWindow
{
    public ObservableCollection<Athlete> Athletes { get; set; }
    public int CompetitionId { get; set; }
    private PagedCollectionView pvcAthlete;

    public AddAthletesToCompetition(int competitionId)
    {
        InitializeComponent();
        CompetitionId = competitionId;
        LoadAthlete();
        Athletes = new ObservableCollection<Athlete>();

    }

    private void OKButton_Click(object sender, RoutedEventArgs e)
    {
        this.DialogResult = true;
    }

    private void CancelButton_Click(object sender, RoutedEventArgs e)
    {
        this.DialogResult = false;
    }
    private void LoadAthlete()
    {
        var context = new PublicServiceClient();
        context.GetAthletesNotInCompetitionCompleted += context_GetAthletesNotInCompetitionCompleted;
        context.GetAthletesNotInCompetitionAsync(CompetitionId);
    }

    void context_GetAthletesNotInCompetitionCompleted(object sender, GetAthletesNotInCompetitionCompletedEventArgs e)
    {
        if (e.Result != null)
        {
            pvcAthlete = new PagedCollectionView(e.Result.ToList());
            dgAthlete.ItemsSource = pvcAthlete;
            dpAthlete.Source = pvcAthlete;
        }
    }


    //Checkbox Checked Event Hanlder
    private void cbAddAthlete_Checked(object sender, RoutedEventArgs e)
    {
        var athlete = ((CheckBox)sender).Tag as AthleteBO;
        if (athlete != null)
        {
            var ath = new Athlete();
            ath.AthleteId = athlete.AthleteId;
            Athletes.Add(ath);
        }
    }


    //CheckBox unchecked Event Handler
    private void cbAddAthlete_Unchecked(object sender, RoutedEventArgs e)
    {
        var athlete = ((CheckBox)sender).Tag as AthleteBO;
        if (athlete != null)
        {
            var item = Athletes.First(i => i.AthleteId == athlete.AthleteId);
            Athletes.Remove(item);
        }
    }

}

      

        
        
        
      

    

As you can see I am using paging everything is working fine, i.e. check and uncheck the checkboxes for the checkboxes to work correctly when we are on the first page, but let's say you checked the first and second items in the grid on the first page, now as soon as I go to the next page that my grid does the persistence of the previous view and by default checks the first and second elements on the second page, which is not expected behavior

I looked through various posts on this issue and found that the problem is that the view is being injected using the datagrid, but somehow I couldn't find any solution.

What others have talked about is updating the observable collection and re-binding it to my grid.

So, I was a little confused how to link this and when to update the observable collection.

I've posted all the code and whenever you reply please point out exactly where I should make the change for this.

As a side note, I am using WCF and EF, so the list of athletes I have here will send this list to the WCF service where using EF it will be inserted into the database.

I know this is not a bug in Silverlight, but this added grid virtualization feature is causing me problems with me currently, so there must be some solution to this problem as well.

thank