Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

"styleClass" from the paginator component in a p-table is not applied in version 16.4.1 #13799

Closed
kuhnlud opened this issue Oct 4, 2023 · 1 comment
Labels
Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible

Comments

@kuhnlud
Copy link

kuhnlud commented Oct 4, 2023

Describe the bug

The classes "p-paginator-top" and "p-paginator-bottom" (defined by the p-table component) are not being applied by the paginator. These classes are useful for configuring the style of the paginator at the top or bottom of a p-table component since they are not styled the same way.
I guess that the Enhancement:
Tree/DataView/Table: there is no way to set a custom class to the paginator component #13204
which set a paginatorStyleClass in the [styleClass] from the paginator, remove the styleClass set from the p-table.
code from the p-table file:

<p-paginator
 /**--*/
    styleClass="p-paginator-top"
 /**--*/
    [styleClass]="paginatorStyleClass"
 >

The styleClass="p-paginator-top" is not applied because of the [styleClass]="paginatorStyleClass". (I presume, at least)

Environment

Windows 11,
node 18.18.0,
npm 9.8.1,
visual studio code

Reproducer

No response

Angular version

16.2.7

PrimeNG version

16.4.1

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

18.18.0

Browser(s)

Chrome 117.0.5938.132

Steps to reproduce the behavior

For example, take the "sakai-ng-master" project. Update it to PrimeNG version 16.4.1, and then, in the tabledemo.component.html page, add "paginatorPosition="both"" to the p-table component. Serve the app.

Open the Chrome DevTools and navigate to the Elements tab. If you inspect the paginator at the top of the p-table, you will notice that the "styleclass="p-paginator-top"" is applied to the element, but not to the div class. The classes applied to the div are: "p-paginator p-component ng-star-inserted." You will notice the same if you inspect the bottom paginator.

If you have installed the "Angular DevTool," you can go to the paginator component and see that the styleClass is set to "undefined."

Expected behavior

The classes "p-paginator-top" or "p-paginator-bottom" are correctly applied to the div element within the paginator, as before, providing the option to style them as needed.

@kuhnlud kuhnlud added the Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible label Oct 4, 2023
@mertsincan
Copy link
Member

Hi,

So sorry for the delayed response! Improvements have been made to many components recently, both in terms of performance and enhancement. Therefore, this improvement may have been developed in another issue ticket without realizing it. You can check this in the documentation. If there is no improvement on this, can you open a new issue so we can include it in our roadmap?

Thanks a lot for your understanding!
Best Regards,

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible
Projects
None yet
Development

No branches or pull requests

2 participants