Reader Level:

Paging Data in the Silverlight DataGrid

By Nipun Tomar on Jul 24, 2008
In this article I will discuss Paging in a Silverlight DataGrid.

Silverlight DataGrid does not have the built-in paging facility. So here is a small piece of code to implement paging in Silverlight DataGrid. For this custom paging

  • Calculate the number of pages based on total number of records and page size
  • Add those many buttons to a container like StackPanel and
  • On those buttons click events bind the DataGrid to desired range of records.


1. Define the following Properties and Variables
public partial class Page : UserControl


        //Property to hold the value of total records

        public int TotalRow { get; set; }

        //Property to hold the value of page size

        public int PageSize { get; set; }

        //Number of rows that the DataGrid

        int totalRowsInGrid = 0;

2. Initialize the values
public Page()



            //Initialize the page size

            PageSize = 10;

            //Get the desired data

            user = User.Get();

            //Set the TotalRow cout to the number of rows returned for data

            TotalRow = user.Count;



            DoPaging(this.PageSize, TotalRow);


3. Create a method to get the desired range of data based on page number
/// <summary>

        /// Returns paged data based on page number

        /// </summary>

        /// <param name="pageNumber"></param>

        /// <returns></returns>

        private List<User> GetData(int pageNumber)


            int Pagestart = (pageNumber - 1) * this.PageSize;

            TextBlockStartPageNumber.Text = (Pagestart+1).ToString();

            TextBlockEndPageNumber.Text = (Pagestart + totalRowsInGrid).ToString();

            TextBlockTotalRecords.Text = TotalRow.ToString();

            int i = TotalRow;

            List<User> PagedData;

            //List<User> PagedData = user.Skip((pageNumber - 1) * PageSize).Take(PageSize) as List<User>;

            //List<YourObject> PageedData = FullList.Skip((PageNumber - 1) * PageSize).Take(PageSize).ToList();

            if ((i - ((pageNumber - 1) * this.PageSize)) >= this.PageSize)

                PagedData = user.GetRange(Pagestart, this.PageSize);


                PagedData = user.GetRange(Pagestart, (i % this.PageSize));

            return PagedData;


4. Bind the DataGrid
/// <summary>

        /// Bind grid to the desired range of records

        /// </summary>

        /// <param name="PageNumber"></param>

        private void BindGrid(int PageNumber)


            if (this.PageSize * PageNumber > this.TotalRow)


                totalRowsInGrid = this.TotalRow % this.PageSize;




                totalRowsInGrid = this.PageSize;


            dataGridPaging.ItemsSource = GetData(PageNumber);


5. Write the click event for the paging buttons
/// <summary>

        /// Handles the click event of buttons having page numbers

        /// </summary>

        /// <param name="sender"></param>

        /// <param name="e"></param>

        void btn_Click(object sender, RoutedEventArgs e)


            Button btn = sender as Button;

            int iPageNumber = Convert.ToInt32(btn.Content.ToString());



That’s all you are done with the custom paging in Silverlight DataGrid.

Nipun Tomar
Nipun Tomar

Nipun Tomar is competent and experienced project leader & architect with 10 years of experience in managing multi-disciplinary teams of varying sizes and complex programs of work. Has the ability to build strong relation... Read more



JetBrains ReSharper Ultimate
.NET code analysis, refactorings, navigation, unit testing, code coverage and profiling in Visual Studio, a bonus for C++ devs, bundled at 50% off.

Trending up