How to implement pagination in repeater control in SharePoint web part

In this SharePoint tutorial, we will discuss how to use repeater control in SharePoint web part. We will create a visual web part in SharePoint 2013 or SharePoint 2016. Inside the SharePoint visual web part, we will add the repeater control.

Use repeater control in SharePoint web part

Now, let us see how to use repeater control in SharePoint web part. We will use the repeater control to bind a SharePoint list data.

Here first create a visual web part in SharePoint 2013/2016.

Use repeater control in SharePoint web part
Use repeater control in SharePoint web part

Here I used the repeater control to bind the SharePoint list data and I used two dropdown lists to filter the data based on ID, Created and Modified, and other dropdowns for Ascending and descending.

In button of the repeater I used two link button which will show you next record and previous record.

In this pagination, the main advantage is, it will not load the all list data at one time. So I am using SPListItemCollectionPosition to get the item position, and user will provide the Page size and row limit while fetching the record from the SharePoint list.

Suppose my row limit is “10” so when I click on Next, It will show you next 10 records instead of getting whole records of the list.

.Aspx File Code

Here is the code that you can use inside the .aspx control

        <asp:DropDownList ID="DropDownListSortColumns" runat="server"
            OnSelectedIndexChanged="DropDownListSortColumns_SelectedIndexChanged" AutoPostBack="true">
            <asp:ListItem>ID</asp:ListItem>
            <asp:ListItem>Created</asp:ListItem>
            <asp:ListItem>Modified</asp:ListItem>

        </asp:DropDownList>
        <asp:DropDownList ID="DropDownListSortOrder" runat="server"
            OnSelectedIndexChanged="DropDownListSortOrder_SelectedIndexChanged" AutoPostBack="true">
            <asp:ListItem Value="True">Ascending</asp:ListItem>
            <asp:ListItem Value="False">Descending</asp:ListItem>
        </asp:DropDownList>
        <asp:Repeater ID="rptgetAllData" runat="server">
            <ItemTemplate>

                <div class="element-item grid-item">
                    <div class="parent">
                        <div class="child">
                            <a href="<%#Eval("Url")%>">
                                <img src="<%#Eval("ImageURL")%>"></a>

                            <div class="flib-data">
                                <a href="<%#Eval("Url")%>">
                                    <div class="title">
                                        <%#Eval("Title")%>
                                        <%#Eval("Created")%>
                                    </div>
                                </a>
                            </div>
                        </div>
                    </div>
                    <!--paernt-->
                </div>

            </ItemTemplate>
        </asp:Repeater>


        <asp:LinkButton ID="LinkButtonPrevious" runat="server" OnClick="LinkButtonPrevious_Click">Previous</asp:LinkButton>

        <asp:Label ID="LabelPaging" runat="server" Text="Label"></asp:Label>

        <asp:LinkButton ID="LinkButtonNext" runat="server" OnClick="LinkButtonNext_Click">Next</asp:LinkButton>

    </div>
</div>

.CS

Below is the SharePoint server object model code file that you can write in the code file.

protected void Page_Load(object sender, EventArgs e)
        {
            if (!Page.IsPostBack)
            {
                LoadData(1, false);
            }
        }

        private void LoadData(int currentPage, bool isPrevious)
        {
            ViewState["CurrentPage"] = currentPage;
            string pageInfo = ViewState["Next"] as string;
            if (isPrevious)
            {
                pageInfo = ViewState["Previous"] as string;
            }
            FillData(pageInfo, DropDownListSortColumns.SelectedValue, Convert.ToBoolean(DropDownListSortOrder.SelectedItem.Value));
        }

        private void FillData(string pagingInfo, string sortColumn, bool sortAscending)
        {
            int currentPage = Convert.ToInt32(ViewState["CurrentPage"]);
            uint rowCount = 3;
            string columnValue="";
            string nextPageString = "Paged=TRUE&p_ID={0}&p_" + sortColumn + "={1}";
            string PreviousPageString = "Paged=TRUE&PagedPrev=TRUE&p_ID={0}&p_" + sortColumn + "={1}";
            SPListItemCollection lstitemCollection;
            List<ClassDTO> BindData = new List<ClassDTO>();
            var query = "<OrderBy><FieldRef Name='" + sortColumn + "' Ascending='" + sortAscending + "' /></OrderBy>";
            lstitemCollection= new SPManager().GetSPListItemsPosition("List Name", query, "Site Name", pagingInfo, rowCount);
            if (lstitemCollection != null)
            {

                foreach (SPListItem item in lstitemCollection)
                {


                    ClassDTO DTO= new ClassDTO();

                    string url = string.Format("/sites/pages/Details.aspx?ItemID={0}", item["ID"].ToString());
                    string imageURL = ((ImageFieldValue)(item["PublishingRollupImage"])).ImageUrl;
                    string title = string.Empty;

                    if (IsEnglish)
                    {
                        title = item["Title"].ToString();
                    }
                    else
                    {
                        title = item["TitleAr"].ToString();
                    }


                    BindData.Add(new ClassDTO{ Title = title, Url = url, ImageURL = imageURL, Created = CommonData.GetFormattedTime(Convert.ToDateTime(item["Created"].ToString())) });


                }

                rptgetAllData.DataSource = BindData;
                rptgetAllData.DataBind();

                //now we need to identify if this is a call from next or first

                if (null != lstitemCollection.ListItemCollectionPosition)
                {
                    if (lstitemCollection .Fields[sortColumn].Type == SPFieldType.DateTime)
                    {
                        columnValue = SPEncode.UrlEncode(Convert.ToDateTime(lstitemCollection[lstitemCollection.Count - 1][sortColumn]).ToUniversalTime().ToString("yyyyMMdd HH:mm:ss"));
                    }
                    else
                    {
                        columnValue = SPEncode.UrlEncode(Convert.ToString(lstitemCollection[lstitemCollection.Count - 1][sortColumn]));
                    }

                    nextPageString = string.Format(nextPageString, lstitemCollection[lstitemCollection.Count - 1].ID, columnValue);
                }
                else
                {
                    nextPageString = string.Empty;
                }

                if (currentPage > 1)
                {

                    if (lstitemCollection.Fields[sortColumn].Type == SPFieldType.DateTime)
                    {
                        columnValue = SPEncode.UrlEncode(Convert.ToDateTime(lstitemCollection[0][sortColumn]).ToUniversalTime().ToString("yyyyMMdd HH:mm:ss"));
                    }
                    else
                    {
                        columnValue = SPEncode.UrlEncode(Convert.ToString(lstitemCollection[0][sortColumn]));
                    }

                    PreviousPageString = string.Format(PreviousPageString, lstitemCollection[0].ID, columnValue);
                }
                else
                {
                    PreviousPageString = string.Empty;
                }


                if (string.IsNullOrEmpty(nextPageString))
                {
                    LinkButtonNext.Visible = false;
                }
                else
                {
                    LinkButtonNext.Visible = true;
                }


                if (string.IsNullOrEmpty(PreviousPageString))
                {
                    LinkButtonPrevious.Visible = false;
                }
                else
                {
                    LinkButtonPrevious.Visible = true;
                }


                ViewState["Previous"] = PreviousPageString;
                ViewState["Next"] = nextPageString;
                LabelPaging.Text = ((currentPage - 1) * rowCount) + 1 + " - " + currentPage * rowCount;
            }
        }
        protected void LinkButtonPrevious_Click(object sender, EventArgs e)
        {
            LoadData(Convert.ToInt32(ViewState["CurrentPage"]) - 1, true);
        }

        protected void LinkButtonNext_Click(object sender, EventArgs e)
        {
            LoadData(Convert.ToInt32(ViewState["CurrentPage"]) + 1,false);
        }

        protected void DropDownListSortColumns_SelectedIndexChanged(object sender, EventArgs e)
        {
            ViewState.Remove("Previous");
            ViewState.Remove("Next");
            LoadData(1, false);
        }

        protected void DropDownListSortOrder_SelectedIndexChanged(object sender, EventArgs e)
        {
            ViewState.Remove("Previous");
            ViewState.Remove("Next");
            LoadData(1,true);
        }



    }

ClassDTO.cs

Below is the class file that you can use in the .cs file.

 public  SPListItemCollection GetSPListItemsPosition(string listName, string camlQuery,string subSite = "", string pagingInfo = "", uint rowLimit = 1)
        {
            string siteUrl = SPContext.Current.Site.Url;
            if (!string.IsNullOrEmpty(subSite))
                siteUrl += string.Concat("/", subSite);

            using (SPSite sPSite = new SPSite(siteUrl, SPUserToken.SystemAccount))
            {
                using (SPWeb sPWeb = sPSite.OpenWeb())
                {
                    SPListItemCollection collection;
                    SPQuery objQuery = new SPQuery();
                    objQuery.RowLimit = rowLimit;
                    objQuery.Query = camlQuery;
                    if (!string.IsNullOrEmpty(pagingInfo))
                    {
                        SPListItemCollectionPosition position = new SPListItemCollectionPosition(pagingInfo);
                        objQuery.ListItemCollectionPosition = position;
                    }
                    collection = sPWeb.Lists[listName].GetItems(objQuery);

                    return collection;
                }
            }
        }

Then you can deploy the visual web part into the SharePoint 2013/2016 site.

You may like the following SharePoint server object examples:

In this tutorial, we learned how to use repeater control in SharePoint web part.

Donwload Hub site pdf

Download SharePoint Online Tutorial PDF FREE!

Get update on Webinars, video tutorials, training courses etc.

>