TemplateDataPager

   Previous topic This is the last topic JavaScript is required for the print function Mail us feedback on this topic! Mail us feedback on this topic!  

The TemplateDataPager control can be used for custom format of data pager. It automatically renders the list of numbers, but you need to write some code to bind it to a control that ensures displaying of the content (e.g. CMSRepeater, CMSDataList or other).

 

Here's a simple example of how you can use it:

 

1.Add the following line to the beginning of your ASPX page:

 

[C#]

 

<%@ Register Assembly="CMS.Controls" Namespace="CMS.Controls" TagPrefix="cc1" %>

 
 

2.Add the following code to the page, inside the <form> element:

 

[C#]

 

<table style="border: solid 1px #CCCCCC; margin-left: auto; margin-right: auto;">

<tr>

  <td style="border-bottom: solid 1px #CCCCCC; padding: 10px; text-align: center;">

      <cc1:CMSRepeater ID="CMSRepeater1" runat="server" Path="/%" ClassNames="CMS.Product"

      TransformationName="CMS.Product.preview">

      </cc1:CMSRepeater>

  </td>

</tr>

<tr>

    <td style="padding: 10px; background-color: #D9D9D9;">

      <cc1:TemplateDataPager ID="TemplateDataPager1" runat="server">

          <NumberTemplate>

              <a href="?Page=<%# Eval("PageNumber") %>">

                    <%# Eval("PageNumber") %>

              </a>

          </NumberTemplate>

          <SelectedNumberTemplate>

              <b>

                <%# Eval("PageNumber") %>

              </b>

          </SelectedNumberTemplate>

          <SeparatorTemplate>

               -

          </SeparatorTemplate>

          <FirstItemTemplate>

              <a href="?Page=1">First</a>&nbsp;|&nbsp;

          </FirstItemTemplate>

          <LastItemTemplate>

              &nbsp;|&nbsp;<a href="?Page=<%# pageCount %>">Last</a>

          </LastItemTemplate>

          <PreviousItemTemplate>

              <a href="?Page=<%# previousPage %>">Previous</a> &nbsp;|&nbsp;

          </PreviousItemTemplate>

          <NextItemTemplate>

              &nbsp;|&nbsp; <a href="?Page=<%# nextPage %>">Next</a>

          </NextItemTemplate>

      </cc1:TemplateDataPager>

    </td>

</tr>

</table>

 

As you can see, the control uses the standard CMSRepeater control. The pager format is specified using the templates inside its definition.
 

3.Modify the code-behind so that it looks like this (the page class name and type may be different):

 

[C#]

 

using CMS.GlobalHelper;

 

public partial class CMSControlsExamples_TemplatedDataPager : ControlsExamplesPage

{

  public string pageCount = "1";

  public string previousPage = "1";

  public string nextPage = "";

 

 

  /// <summary>

  /// OnInit override

  /// </summary>

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

  protected override void OnInit(EventArgs e)

   {

      // Disable repeater pager and databindbydefault

       CMSRepeater1.EnablePaging = false;

       CMSRepeater1.DataBindByDefault = false;

 

      base.OnInit(e);

   }

 

 

  protected void Page_Load(object sender, EventArgs e)

   {

      // Get repeater datasource

       TemplateDataPager1.DataSource = CMSRepeater1.DataSource;

     

      // Set page size

       TemplateDataPager1.PageSize = 1;

 

      // Set current page from query string

       TemplateDataPager1.CurrentPage = ValidationHelper.GetInteger(Request.QueryString["Page"], 1);

     

      // Get page number for last link

       pageCount = ((int)(TemplateDataPager1.PageCount - 1)).ToString();

 

      // Set default next page link

       nextPage = pageCount;

 

      // Set previous link

      if ((TemplateDataPager1.CurrentPage - 1) >= 1)

       {

           previousPage = ((int)(TemplateDataPager1.CurrentPage - 1)).ToString();

       }

 

      // Set next link

      if ((TemplateDataPager1.CurrentPage + 1) <= (TemplateDataPager1.PageCount - 1))

       {

           nextPage = ((int)(TemplateDataPager1.CurrentPage + 1)).ToString();

       }

 

      // Set paged datasource to the repeater and databind it

       CMSRepeater1.DataSource = TemplateDataPager1.PagedData;

      if (!DataHelper.DataSourceIsEmpty(CMSRepeater1.DataSource))

       {

           CMSRepeater1.DataBind();

       }

   }

}

 

4.Save all changes and see the page on the live site. It will look like this:
 
clip0089

 

Page url: http://devnet.kentico.com/docs/controls/index.html?templatedatapager.htm