h1

Paging in Episerver

February 27, 2008

Paging with Episerver PageList

When you want a list of some sort (Search news, blog, …) and it is getting big you need to implemnt paging. This can be done very easily if you are yousing a Episerver PageList control. The only thing you do is add 2 properties paging and PagesPerPagingItem:

<EPiServer:PageList 
        ID=”SearchResult” runat=”server”
        Paging=”true”  
        PagesPerPagingItem=”15″
        SortOrder=”PublishedDescending”>

That way you will have automatic paging active. BUT! at first you will notice if you are using version 4.61 that the paging isnt working. you get the same page (the first page) whatever page number you click. This is because you need to rebind ans such on postback too. This might be fixed in CMS 5 though.

Paging with asp.net Repeater

Some blogs are made so that all posts or / and comments are made of Episerver XForm posts. To make paging of these I suggest using repeater and PagedDataSource. I found a great article about this that I used the first time. The article is written by Harrison Enholm and explains good how to use it. I added some to this for example number buttons for the pages:

for (int i = 0; i < pages; i++)
{
hl =
new LinkButton();
hl.Command +=
new CommandEventHandler(navClick);
hl.CommandName =
“cmdPage_Click”;
hl.CommandArgument = i.ToString();
hl.Text = (i + 1).ToString();
if ((i == 0) && (!IsPostBack))
{
hl.ToolTip =
“Aktuell sida”
}
else
{
hl.ToolTip =
“Sidan “ + (i + 1).ToString();
}
hl.ID =
“PageNumberButton” + (i + 1).ToString();
hl.EnableViewState =
false;
pageNumbers.Controls.Add(hl);
l =
new Literal();
l.Text =
” “;
l.ID =
“SpaceLiteral” + (i + 1).ToString();
pageNumbers.Controls.Add(l);
}

 That is I have a placeholder beween the prev and next buttons and then in the above loop I add a number linkbutton for each page with a command where I can move the visitor to the page. This and a First Last buttons makes it pretty much equal in functionality as the PageList paging. For more code pls contact me =)

Enjoy! 

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: