TagHelpers
TagHelpers copied to clipboard
LazZiya
Page Size does not expand with Bootstrap 5.3
The Page Size drop down does not expand with Bootstrap 5.3. It appears that this can be fixed by changing data-toggle to data-bs-toggle.
As described in the docs, adding the following attribute will fix the problem:
<paging render-mode="Bootstrap5">
</paging>
It is set in the config. Can the render mode only be set on the tag itself?
I resolved by adding some javascript to add it.
var pageSizeDropDown = document.getElementById("pagingDropDownMenuBtn");
pageSizeDropDown.setAttribute("data-bs-toggle", "dropdown");
"lazziya": {
"pagingTagHelper": {
"default": {
"render-mode": "Bootstrap5",
"max-displayed-pages": 10,
"page-size-dropdown-items": "10-25-50",
"query-string-key-page-no": "pageNo",
"query-string-key-page-size": "pageSize",
"show-first-last": true,
"show-prev-next": true,
"show-page-size-nav": true,
"show-total-pages": true,
"show-total-records": true,
"show-gap": true,
"text-page-size": "",
"text-first": "",
"text-last": "",
"text-previous": "",
"text-next": "",
"text-total-pages": "pages",
"text-total-records": "records",
"sr-text-first": "First",
"sr-text-last": "Last",
"sr-text-previous": "Previous",
"sr-text-next": "Next",
"class": "row",
"class-info-div": "col-3 text-end",
"class-page-size-div": "col-1",
"class-paging-control-div": "col-8",
"class-paging-control": "pagination",
"class-active-page": "active",
"class-disabled-jumping-button": "disabled",
"class-total-pages": "btn btn-link text-decoration-none",
"class-total-records": "btn btn-link text-decoration-none"
}
}
}