CODEWITHSUNDEEP
angulartypescript
Randy
Randy

Reputation: 809

Is there a working column filter example for PrimeNG Table (p-table) like the demo?

https://www.primefaces.org/primeng/showcase/#/table

shows a working demo but the stackblitz example is not what is running above. I have multiselect dropdown fitlers working, but location of the dialog and styling are off. The styling in the stackblitz in the url above is also off. I am looking for a working code example with sorting and filtering per column.

Upvotes: 0

Views: 3292

Answers (2)

Randy
Randy

Reputation: 809

So one of my issues was that I had the overlay/popup dialog for the filter not displaying in the right place and under other DOM items weirdly. I finally solved this after examining CSS by ensuring that I had all of these

imports: [        
    ...
    ...
    //start: added from example code for p-table
    BrowserModule,
    BrowserAnimationsModule,
    TableModule,
    CalendarModule,
    SliderModule,
    DialogModule,
    MultiSelectModule,
    ContextMenuModule,
    DropdownModule,
    ButtonModule,
    InputTextModule,
    ProgressBarModule,
    HttpClientModule,
    FormsModule,
    //end: added from example code for p-table

in my app.module.ts file. I must have been missing one or two and it didn't render correctly. There was no warning or compile issue as those imports seem to be needed "under the covers" for p-table when using column filters as overlays.

Upvotes: 0

Juan Vicente Berzosa Tejero
Juan Vicente Berzosa Tejero

Reputation: 3022

Is this what you are looking for?:

https://stackblitz.com/edit/primeng-tablesort-demo

https://stackblitz.com/edit/primeng-tablefilter-demo

Upvotes: 1

Related Questions