Similar UniPager on several pages

Alexander Pinin asked on May 26, 2017 12:43

Hi, everyone!
I'm using UniPager on my aspx templates, and there is something like this:

<cms:UniPager ID="UniPager1" runat="server" PageControl="SearchResults1">
  <PageNumbersTemplate>
    <li><a class="pageClicks" href="<%# Eval("PageURL") %>"><%# Eval("Page") %></a></li>
  </PageNumbersTemplate>
</cms:UniPager>

I have to put this code to each template where I want to use pager. To change pager I have to do it on each template.
Is there the way to define this control once and use the configured one in several places?
Thanks in advance.

Recent Answers


Anton Grekhovodov answered on May 26, 2017 13:30

Hi,

Yes, it's possible, you need to create ASCX control where you put your UniPager and then you will use the control in your templates. Maybe you will need to encapsulate some Unipager properties to pass parameters into it. Kentico ASCX controls are called Webparts (you can use them with Portal engine) and you can see how they use UniPager control in it CMS\CMSWebParts\Viewers\Basic\UniPager.ascx. But they use transformations for templates instead of inline templates.

1 votesVote for this answer Mark as a Correct answer

Peter Mogilnitski answered on May 26, 2017 15:52

0 votesVote for this answer Mark as a Correct answer

Prashant Verma answered on May 26, 2017 16:07 (last edited on May 26, 2017 16:08)

Hi Alexander,

Best practice is to create a user control add your customized UniPager and use it anywhere just adding that Usercontrol example.

Thanks

Happy to help you

2 votesVote for this answer Mark as a Correct answer

Alexander Pinin answered on May 26, 2017 19:22 (last edited on May 29, 2017 05:09)

I tried to use asp controls. I put my pager into the control, and made a property in the control to assign an UniView. Then I put my control under the UniView and assigned the UniView, but pager didn't appear. May be I should call some additional bindings. or something like that?

0 votesVote for this answer Mark as a Correct answer

Anton Grekhovodov answered on May 29, 2017 06:35

Try to call Databind() method for your UniView during Load event, it may help. Also read the first 'Note' here https://docs.kentico.com/k10/references/kentico-controls/generic-controls/paging-controls/unipager. It will explain you how it works.

1 votesVote for this answer Mark as a Correct answer

Alexander Pinin answered on May 30, 2017 05:07

Thank you guys. Unfortunately nothing helps. In the UniView documentation mentioned that I have to disable an auto binding in my repeaters. I use UniView and it looks like this control has no property to disable the auto binding. I think I should look for better controller with an included pager.

0 votesVote for this answer Mark as a Correct answer

Anton Grekhovodov answered on May 30, 2017 08:29

Hi Alexander, It's difficult to say why it doesn't work for you, but I created a simple control and it works:

Template code (DemoPage.aspx):

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="~/CMSWebParts/Demo/DemoPage.aspx.cs" Inherits="CMSApp.CMSWebParts.Demo.DemoPage" %>

<!-- Register my custom control with pagination -->
<%@ Register Src="~/CMSWebParts/Demo/DemoPager.ascx" TagPrefix="uc1" TagName="DemoPager" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <!-- Add my custom control on page -->
        <uc1:DemoPager runat="server" id="Unipager" />
    </div>
    </form>
</body>
</html>

Demo control code behind (DemoPager.ascx.cs):

using System;
using System.Web.UI;
using CMS.DocumentEngine;
using CMS.Helpers;

public partial class CMSApp_CMSWebParts_Demo_DemoPager : UserControl
{
protected override void OnLoad(EventArgs e)
{
    base.OnLoad(e);

    var ds = DocumentHelper.GetDocuments("CMS.MenuItem").Path("/", PathTypeEnum.Children).OrderBy("NodeLevel, NodeOrder");

    // Checks that the DataSet isn't empty
    if (DataHelper.DataSourceIsEmpty(ds)) return;

    // Binds the DataSet to the UniView control
    UniView1.DataSource = ds;
    UniView1.DataBind();
}
}

Demo contol ascx file (DemoPager.ascx):

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="DemoPager.ascx.cs" Inherits="CMSApp_CMSWebParts_Demo_DemoPager" %>
<h3>Demo Unipager</h3>
<cms:UniView ID="UniView1" runat="server">
<ItemTemplate>
    <li>
        <%# HTMLHelper.HTMLEncode(Convert.ToString(Eval("NodeName"))) %>
    </li>
</ItemTemplate>
<HeaderTemplate>
    <ul>
</HeaderTemplate>
<FooterTemplate>
    </ul>
</FooterTemplate>
</cms:UniView>

<cms:UniPager ID="UniPager1" runat="server" PageControl="UniView1" GroupSize="10" PageSize="3">
<PageNumbersTemplate>
    <a class="demo" href="<%# Eval("PageURL") %>"><%# Eval("Page") %></a>
</PageNumbersTemplate>
</cms:UniPager>

And as result I got list of items and pagination:
Image Text

0 votesVote for this answer Mark as a Correct answer

Alexander Pinin answered on May 30, 2017 09:26

Yes, but you created both UniView and UniPager in the same controller. I'd like to create UniPager in separate controller and place that controller on the aspx page where UniView is. So both elements would defined in separate places.

0 votesVote for this answer Mark as a Correct answer

Anton Grekhovodov answered on May 30, 2017 10:25

It doesn't matter in which controllers they are or how you wrap it, you always need to bind UniPager to UniView. If you have separeted controls, you just need to create a property for your UniPager control like that:

public string PageControl
{
    get { return UniPager1.PageControl; }
    set { UniPager1.PageControl = value; }
}

And then you'll need assign UniView ID to this property:

<cms:UniView runat="server" ID="UniView1>
...
</cms:UniView>
<uc1:DemoPager runat="server" ID="Unipager" PageControl="UniView1"/>

And it will work.

2 votesVote for this answer Mark as a Correct answer

Alexander Pinin answered on May 30, 2017 10:45

Yes, Anton, I do the same) I have no idea what goes wrong.

0 votesVote for this answer Mark as a Correct answer

   Please, sign in to be able to submit a new answer.