Search code examples
angularprimengprimeng-datatable

In primeng Datatable custom filter not working


I have a datatable with column Org . Distinct list of orgs are in an array. How to add this list in the column filter dropdown box. When i try to add the options with the list , drop down displays with no value.can someone please let me know how to add dynamic values in the dropdown?

<p-column  field="org" header ="Org" [sortable]="true" [filter]="true" filterMatchMode="equals">
        <ng-template pTemplate="filter" let-col>
          <p-dropdown [options]="orgGroupList" [style]="{'width':'100%'}"  styleClass="ui-column-filter"></p-dropdown>
        </ng-template>
      </p-column>


this.orgGroupList = 2,3,4,5,6,7

Solution

  • It worked after including appendTo="body" in the drop down tag

    <ng-template pTemplate="filter" let-col>
              <p-dropdown [options]="orgs" [(ngModel)]="selectedOrg" appendTo="body" [style]="{'width':'100%'}"  (onChange)="dt.filter($event.value,col.field,col.filterMatchMode)" styleClass="ui-column-filter"></p-dropdown>
            </ng-template>