Pioneer Pagination

What is Pioneer Pagination?

Pioneer Pagination is an ASP.Net Core Tag Helper that produces a paginated list which is configured to a desired state.

Where can I get it?

Pioneer Pagination is available as a NuGet package.

How does it work?

1. In your controller, you make a call to PaginatedMetaService which returns a PaginatedMetaModel.
2. Your PaginatedMetaModel is then passed to your view so that the Tag Helper can utilize it.
3. In your view, you bind the PaginatedMetaModel to an attribute and set a route on another attribute.
4. The Tag Helper generates a paginated list.

How do I use it?

For a full working example, clone this repository and run the Pioneer.Pagination.Example project locally.

Install

To install, run the following command from your package manager console:

PM> Install-Package Pioneer.Pagination

Gain access to the PaginatedMetaService service.

In your Startup.cs class, add PaginatedMetaService into your dependency injection container.

public void ConfigureServices(IServiceCollection services)
{
    services.AddTransient<IPaginatedMetaService, PaginatedMetaService>();
}

In your controller, add a reference to the IPaginatedMetaService interface and set it through dependency injection.

public class BlogController : Controller
{
    private readonly IPaginatedMetaService _paginatedMetaService;

    public BlogController(IPaginatedMetaService paginatedMetaService)
    {
        _paginatedMetaService = paginatedMetaService;
    }
}

Add PaginatedMetaModel to ViewBag

From your controller, bind the PaginatedMetaModel to your ViewBag.

public ActionResult Index(int page = 1)
{
	// Typically obtained from a service/repository
    var totalNumberInCollection = 100;
	// Typically obtained from configuration
    var itemsPerPage = 5;
    ViewBag.PaginatedMeta = _paginatedMetaService.GetMetaData(totalNumberInCollection, page, itemsPerPage);
    return View("Blog", post);
}

Add Tag Helper to your view

<pioneer-pagination info="@ViewBag.PaginatedMeta" route="/blog"></pioneer-pagination>

Configuration

• previous-page-text
  • default = next
• previous-page-text
  • default = previous

<pioneer-pagination info="@ViewBag.PaginatedMeta" route="/blog" previous-page-text="hey" next-page-text="you"></pioneer-pagination>

What about styling?

The markup this produces is based on Foundation Pagination. This leaves you one of three options.

1. Use Foundation and it will work out of the box.
2. Map the classes to Bootstrap stylings.
3. Use the starting CSS or sass files provided in the example.

Clamping

The services will clamp out of range indexes passed to _paginatedMetaService.GetMetaData. If you pass a current page value < 1, it will be clamped to 1. If you pass a current page value > then the collectionSize \ itemsPerPage , it will get clamped to the last valid page.

Because the aggragation of data is handled independetly of the actual tag helper, you will need to insure you are clamping the requests coming from the user in the same manner.

Change Log

[3.0]

• Migrate to .net standard 2.1
• Migrate example to .net core 3.1

[2.1.2]

• Security updates.

[2.1.1]

• Account for out of range request for a page by clamping them.

[2.1.0]

• Add configuration for previous and next verbiage - ryn0

[2.0.0]

• Migarted to .NET Standard 2.x
• Migarted example project to ASP.NET Core 2.x

[1.1.2]

• Fixed Next button not being displayed
  • Next should be displayed up until last page.
  • Added supported UTs.

[1.1.0]

• Upgrade to LTS 1.0.3
• Fixed previous and next button indexing
  • Supporting UTs.