Datapager with listbox in Silverlight


Introduction:

This blog shows we can datapager with listbox in silverlight.

We can display the elements in listbox by using datapager in silverlight.
We have pagedDataCollecion which is used for grouping,sortin ,filtering and navigating
a paged data collection.
Example :

1. We have one service named Service1.svc
Access data over here.
[OperationContract]
        public List<CustomerData> DoWork()
        {
            DataClasses1DataContext db = new DataClasses1DataContext();
            var result = from p in db.CustomerDatas select p;
            return result.ToList();
        }
2. In MainPage.Xaml we have ListBox and Datapager.
 <ListBox Height="100" HorizontalAlignment="Left" Margin="121,12,0,0" Name="listBox1" VerticalAlignment="Top" Width="120" />
 <sdk:DataPager Height="26" HorizontalAlignment="Left" Margin="168,118,0,0" Name="dataPager1" PageSize="10" VerticalAlignment="Top" Width="182" />
3.In MainPage.Xaml.cs we binding data to pager and listbox as below.
//Get data from service which we have in our application.
 public void getdata()
        {
            ServiceReference1.Service1Client ser = new ServiceReference1.Service1Client();
            ser.DoWorkCompleted += new EventHandler<ServiceReference1.DoWorkCompletedEventArgs>(ser_DoWorkCompleted);
            ser.DoWorkAsync();
        }
//Take data in pagedCollectionview (e.result). Set DisplayMemeberPath as we want like ("Name") to listbox.
//Set PagedCollectionView (pcv) to source property of datapager,set the pagesize too.
According to the pagesize of datapager data will display in listbox.
void ser_DoWorkCompleted(object sender, ServiceReference1.DoWorkCompletedEventArgs e)
        {
            PagedCollectionView pcv = new PagedCollectionView(e.Result);
            dataPager1.Source = pcv;
            dataPager1.PageSize = 3;
            listBox1.ItemsSource = pcv;
           
            //listBox1.ItemsSource = e.Result;
            listBox1.DisplayMemberPath = "Name";
        }

Thanks.