help.axcms.netAxinom Logo
Save Save Chapter Send Feedback

Using the Axinom Pager

Here you get an example for using the Axinom-Pager

The axinom-pager is a webcontrol made by axinom. It's an independent control providing basic-pager-functionality. You can set the amount of links to show, limit the PageSize and react on events fired by the pager (for example LinkClicked).


1. Add a reference to the assembly Axinom.Framework.dll.

2. Create a new TestPage (for example Test.aspx) with the following content
   
<%@ Register TagPrefix="Axinom" Namespace="Axinom.Framework.UI" Assembly="Axinom.Framework" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >

<html>
<head>
<title>PagerTest</title>
</head>

<body MS_POSITIONING="GridLayout">

<form id="Form1" method="post" runat="server">
Here are a few runbers:<br>
<br>
<asp:Repeater Runat=server ID="numberRepeater">
<ItemTemplate>
<asp:Label Runat=server ID="numberLabel"/><br>
</ItemTemplate>
</asp:Repeater>

<Axinom:AxPager id="numberPager" runat="server" />
</form>

</body>
</html>

As you can see, there is a repeater and the axinom-Pager on this page.

3. The Code-Behind for this aspx-file is

using System;
using System.Collections;
using System.Web.UI.WebControls;
using Axinom.Framework.UI;
using Page = System.Web.UI.Page;

namespace TestWeb
{
public class _Default : Page
{
protected Repeater numberRepeater;
protected AxPager numberPager;
private void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
InitPager();
this.numberRepeater.DataSource = Filter(Get100Numbers(), this.numberPager);
this.numberRepeater.DataBind();
}
}
private void numberPager_LinkClicked(object sender, EventArgs e)
{
this.numberRepeater.DataSource = Filter(Get100Numbers(), this.numberPager);
this.numberRepeater.DataBind();
}
private void numberRepeater_ItemDataBound(object sender, RepeaterItemEventArgs e)
{
int number = (int) e.Item.DataItem;
Label numberLabel = (Label) e.Item.FindControl("numberLabel");

numberLabel.Text = number.ToString();
}

private ArrayList Get100Numbers()
{
ArrayList result = new ArrayList();
for (int i = 1; i< 101; i++)
result.Add(i);

return result;
}

private void InitPager()
{
this.numberPager.PageButtonCount = 10; // Amount of Number-Links to show
this.numberPager.Style.GotoLabel = "go to"; // Text for
this.numberPager.Style.OFLabel = "of"; // the pager
this.numberPager.Style.PageLabel = "Page"; // to show
this.numberPager.PageCount = 10; // Amount of items per Page
this.numberPager.DataBind();
}

public ArrayList Filter(ICollection items, AxPager pager)
{
ArrayList filteredItems = new ArrayList();
int firstItem = (pager.CurrentPageIndex) * pager.PageCount;
int lastItem = (pager.CurrentPageIndex + 1) * pager.PageCount - 1;
int i = 0;
foreach(object item in items)
{
if (i >= firstItem && i <= lastItem)
{
filteredItems.Add(item);
}
i++;
}
return filteredItems;
}

#region Web Form Designer generated code
override protected void OnInit(EventArgs e)
{
InitializeComponent();
base.OnInit(e);
}

private void InitializeComponent()
{
this.Load += new EventHandler(this.Page_Load);
this.numberRepeater.ItemDataBound +=new RepeaterItemEventHandler(numberRepeater_ItemDataBound);
this.numberPager.LinkClicked +=new EventHandler(numberPager_LinkClicked);
}
#endregion
}
}


4. Description

As you can see, there is a repeater which is bound to a List of 100 Numbers. The Method Filter() returns the set of numbers needed for the page of numbers to show. The Method InitPager sets the base-properties of the Pager like the amount of links to show and how many items should be shown per page. this Method is only called if there is no postback.

2 events are registered in method InitializeComponent(). The first one is for the repeater occurring for each number in the ArrayList bound to the repeater. The second event is for the Pager. If a link is clicked to show another page with numbers, this event is raised and the repeater is bound to the new filtered datasource.

5. Download

You can download the sample files here.