Comment on page

TagHelpers

This part contains number of tag-helpers that could be used in many different situations.
Contents
​AnchorMatchTagHelper - add needed css-classes to target anchor depending on current url;
​AppendClassTagHelper - add needed css-classes to target element dynamically regarding provided condition;
​PageInfoTagHelper - organize info-text about items lists pagination;
​PageSizeTagHelper - create dropdown with possible number of pages on list;
​PaginationTagHelper - create pagination controls simply;
​SortTagHelper - organize items list sorting;
​TagHelperOutputExtensions - some extension methods for TagHelperOutput class.
AnchorMatchTagHelper
An AnchorTagHelper implementation that adds CSS class to target <a> element when current Area, Controller and Action RouteData values correspond to specified ones.
Property name
Property type
Description
MatchClass
string
A CSS class to add to html element.
<a asp-action="Details" asp-route-id="@user.Id" asp-match-class="active" class="nav-link">Details</a>
<a asp-action="Contracts" asp-route-id="@user.Id" asp-match-class="active" class="nav-link">Contracts</a>
<a asp-action="Statistics" asp-route-id="@user.Id" asp-match-class="active" class="nav-link">Statistics</a>
Each of links above will be highlighted by adding active css class only when user currently located on corresponding page (which means required area, controller and action).
AppendClassTagHelper
A TagHelper implementation that adds CSS class to target element when "asp-append-if" is set to true.
Property name
Property type
Description
Append
bool
A condition that determines whenever class should or shouldn't be added.
Class
bool
A CSS class to add to html element.
<a asp-action="Index" asp-controller="Departments" asp-append-if='@(controller == "Departments")' asp-append-class="active" class="dropdown-item">Departments list</a>
PageInfoTagHelper
A TagHelper implementation allowing to organize info-text about pagination in a simple manner.
Property name
Property type
Description
Options
PageInfoOptions
Options to be used while creating info-text about pagination.
The PageInfoOptions are:
Property name
Property type
Description
PagedList
IPagedList
An instance of Structr.Collections.IPagedList to get information about pagination from.
Format
string
Info-text format string. It uses string-interpolation with following 5 parameters: 0 - page number, 1 - total pages, 2 - first item on page, 3 - last item on page, 4 - total items.
<page-info asp-options='new PageInfoOptions { PagedList = Model.Items, Format = "Page {0} of {1}. Showing items {2} through {3} of {4}." }' />
After rendering it will give:
<div class="page-info">Page 7 of 12. Showing items 61 through 70 of 116.</div>
PageSizeTagHelper
A TagHelper implementation that creates dropdown menu for page size changing.
Property name
Property type
Description
Options
PageSizeOptions
Options influencing appearance of dropdown menu.
The PageSizeOptions are:
Property name
Property type
Description
AllItemsFormat
string
A text to show for menu element corresponding to visualizing of all items.
DropdownMenuAlign
PageSizeDropdownMenuAlign
Align of dropdown menu elements.
ContainerCssClass
string
Css class for controls container.
DropdownCssClass
string
Css class for div container of dropdown defining count of elements on page.
DropdownToggleCssClass
string
Css class for button of dropdown defining count of elements on page.
DropdownToggleAttribute
string
Name of html-attribute to identify a dropdown.
ItemsPerPage
IEnumerable<int>
List of possible values of page sizes.
PageSizeRouteParamName
string
Name of route parameter containing the page size value.
DefaultPageSize
int
Page size by default.
<page-size asp-options='@(new PageSizeOptions { ItemsPerPage = Model.Query.ItemsPerPage, DefaultPageSize = Model.Query.PageSize, AllItemsFormat = "Show all", DropdownToggleCssClass = "btn btn-outline-secondary bd bd-grey-300" })' />
After rendering it will give:
<div class="page-size dropdown dropup">
    <button class="btn btn-outline-secondary bd bd-grey-300 dropdown-toggle" data-toggle="dropdown" type="button">25</button>
    <div class="dropdown-menu-right dropdown-menu">
        <a class="dropdown-item" href="/ru/admin/bundles/?pagesize=25">25</a>
        <a class="dropdown-item" href="/ru/admin/bundles/?pagesize=50">50</a>
        <a class="dropdown-item" href="/ru/admin/bundles/?pagesize=100">100</a>
    </div>
</div>
PaginationTagHelper
A TagHelper implementation creating an array of buttons and other elements forming UI pagination controls without boring manual work.
Property name
Property type
Description
Options
PaginationOptions
Options influencing appearance of UI pagination controls.
The PaginationOptions are:
Property name
Property type
Description
PagedList
IPagedList
An instance of Structr.Collections.IPagedList to get information about pagination from.
PageUrlGenerator
Func<int, string>
Factory intended for generation of urls to different pages.
Display
PaginationDisplayMode
Determines display mode for all pagination controls.
DisplayLinkToFirstPage, etc.
PaginationDisplayMode
Determines display mode for different buttons.
DisplayLinkToIndividualPages
bool
Determines whenever buttons to specific pages should be displayed or not. Default value is true.
MaximumPageNumbersToDisplay
bool
Maximum count of buttons with page numbers to display. Default value is 3.
DisplayEllipsesWhenNotShowingAllPageNumbers
bool
Determines whenever to display ellipses between sets of buttons or not.
EllipsesFormat
string
Format of ellipsis displayed between sets of page buttons. Default value is "...".
LinkToFirstPageFormat, etc.
string
Format of buttons redirecting to first and other pages respectively. Default values are ««, «, etc.
FunctionToDisplayEachPageNumber
Func<int, string>
Allows to transform output of page numbers allowing to build for example something like "First", "Second", etc.
DelimiterBetweenPageNumbers
string
Delimiter strings to place between page numbers.
FunctionToTransformEachPageLink
string
Method allowing to format HTML for li and a inside of paging controls, using TagBuilders.
PageNumberRouteParamName
string
Route parameter name for page number. Default value is page.
<pagination asp-options='@(new PaginationOptions {
    PagedList = Model.Items,
    UlElementCssClasses = new[] { "pagination", "pagination-basic", "pagination-primary", "mg-b-0" },
    LinkToFirstPageFormat = "«",
    LinkToLastPageFormat = "»"
})' />
After rendering it will give:
<div class="pagination-container">
    <ul class="mg-b-0 pagination-primary pagination-basic pagination">
        <li class="page-item first pagination-first"><a class="page-link" href="/admin/users/?page=1">«</a></li>
        <li class="page-item disabled pagination-ellipses"><a class="page-link">…</a></li>
        <li class="page-item"><a class="page-link" href="/admin/users/?page=3">3</a></li>
        <li class="page-item active"><a class="page-link">4</a></li>
        <li class="page-item"><a class="page-link" href="/admin/users/?page=5">5</a></li>
        <li class="page-item disabled pagination-ellipses"><a class="page-link">…</a></li>
        <li class="page-item last pagination-last"><a class="page-link" href="/admin/users/?page=256">»</a></li>
    </ul>
</div>
SortTagHelper
A TagHelper implementation creating sorting controls for UI.
Property name
Property type
Description
Sort
string
Name of Model field to sort by. When value of field equals DefaultSort then sorting will be performed.
DefaultSort
string
Value of field to sort by, taken from query (url). For example @Model.Query.Sort.
DefaultOrder
SortOrder?
Sort order to be used, taken from query (url). For example @Model.Query.Order.
Options
SortOptions
Options influencing appearance of sorting controls.
The SortOptions are:
Property name
Property type
Description
LinkCssCLass
string
Css class for links. Default value is sort.
ActiveCssClass
string
Css class for active element. Default value is active.
SortRouteParamName
string
Name of route parameter containing name of field to sort by. Default value is sort.
OrderRouteParamName
string
Route parameter name for sort order. Default value is order.
<li class="list-sort-item list-inline-item"
    asp-sort="Year"
    asp-default-sort="@Model.Query.Sort"
    asp-default-order="@Model.Query.Order">
    Sort by year
</li>
After rendering it will give:
<li class="list-sort-item list-inline-item">
    <a class="sort" href="/Books/?sort=Year&order=Asc">Sort by year</a>
</li>
TagHelperOutputExtensions
Method name
Return type
Description
AddClass
void
Adds specified class to TagHelper output using using built-in instance of the System.Text.Encodings.Web.HtmlEncoder.
RemoveClass
void
Removes specified class from TagHelper output using built-in instance of the System.Text.Encodings.Web.HtmlEncoder.

Property name	Property type	Description
MatchClass	`string`	A CSS class to add to html element.

Property name	Property type	Description
Append	`bool`	A condition that determines whenever class should or shouldn't be added.
Class	`bool`	A CSS class to add to html element.

Property name	Property type	Description
Options	`PageInfoOptions`	Options to be used while creating info-text about pagination.

Property name	Property type	Description
PagedList	`IPagedList`	An instance of `Structr.Collections.IPagedList` to get information about pagination from.
Format	`string`	Info-text format string. It uses string-interpolation with following 5 parameters: 0 - page number, 1 - total pages, 2 - first item on page, 3 - last item on page, 4 - total items.

Property name	Property type	Description
Options	`PageSizeOptions`	Options influencing appearance of dropdown menu.

Property name	Property type	Description
AllItemsFormat	`string`	A text to show for menu element corresponding to visualizing of all items.
DropdownMenuAlign	`PageSizeDropdownMenuAlign`	Align of dropdown menu elements.
ContainerCssClass	`string`	Css class for controls container.
DropdownCssClass	`string`	Css class for div container of dropdown defining count of elements on page.
DropdownToggleCssClass	`string`	Css class for button of dropdown defining count of elements on page.
DropdownToggleAttribute	`string`	Name of html-attribute to identify a dropdown.
ItemsPerPage	`IEnumerable<int>`	List of possible values of page sizes.
PageSizeRouteParamName	`string`	Name of route parameter containing the page size value.
DefaultPageSize	`int`	Page size by default.

Property name	Property type	Description
Options	`PaginationOptions`	Options influencing appearance of UI pagination controls.

Property name	Property type	Description
PagedList	`IPagedList`	An instance of `Structr.Collections.IPagedList` to get information about pagination from.
PageUrlGenerator	`Func<int, string>`	Factory intended for generation of urls to different pages.
Display	`PaginationDisplayMode`	Determines display mode for all pagination controls.
DisplayLinkToFirstPage, etc.	`PaginationDisplayMode`	Determines display mode for different buttons.
DisplayLinkToIndividualPages	`bool`	Determines whenever buttons to specific pages should be displayed or not. Default value is `true`.
MaximumPageNumbersToDisplay	`bool`	Maximum count of buttons with page numbers to display. Default value is 3.
DisplayEllipsesWhenNotShowingAllPageNumbers	`bool`	Determines whenever to display ellipses between sets of buttons or not.
EllipsesFormat	`string`	Format of ellipsis displayed between sets of page buttons. Default value is "`...`".
LinkToFirstPageFormat, etc.	`string`	Format of buttons redirecting to first and other pages respectively. Default values are `««`, `«`, etc.
FunctionToDisplayEachPageNumber	`Func<int, string>`	Allows to transform output of page numbers allowing to build for example something like "First", "Second", etc.
DelimiterBetweenPageNumbers	`string`	Delimiter strings to place between page numbers.
FunctionToTransformEachPageLink	`string`	Method allowing to format HTML for `li` and `a` inside of paging controls, using TagBuilders.
PageNumberRouteParamName	`string`	Route parameter name for page number. Default value is `page`.

Property name	Property type	Description
Sort	`string`	Name of Model field to sort by. When value of field equals `DefaultSort` then sorting will be performed.
DefaultSort	`string`	Value of field to sort by, taken from query (url). For example `@Model.Query.Sort`.
DefaultOrder	`SortOrder?`	Sort order to be used, taken from query (url). For example `@Model.Query.Order`.
Options	`SortOptions`	Options influencing appearance of sorting controls.

Property name	Property type	Description
LinkCssCLass	`string`	Css class for links. Default value is `sort`.
ActiveCssClass	`string`	Css class for active element. Default value is `active`.
SortRouteParamName	`string`	Name of route parameter containing name of field to sort by. Default value is `sort`.
OrderRouteParamName	`string`	Route parameter name for sort order. Default value is `order`.

Method name	Return type	Description
AddClass	`void`	Adds specified class to TagHelper output using using built-in instance of the `System.Text.Encodings.Web.HtmlEncoder`.
RemoveClass	`void`	Removes specified class from TagHelper output using built-in instance of the `System.Text.Encodings.Web.HtmlEncoder`.

Routing

Validation

Last modified 1yr ago