Filtering p-dataView with p-dropdown NgPrime

682 Views Asked by At

I am struggling with filtering a dataView with a dropdown menu using NgPrime. It's specifically the dropdown that's giving me a hard time. In fact, I have a working pInputText that filters the dataView for the same thing which tells me it's my dropdown that isn't working, not the dataView in general.

dataView definition:

<p-dataView #dv [value]="things" layout="grid" filterBy="x ,y ,z" [sortField]="sortField" [sortOrder]="sortOrder" [paginator]="true" [rows]="20" paginatorPosition="both">

Dropdown that works for sorting:

<p-dropdown [options]="sortOptions" [(ngModel)]="sortKey" [placeholder]="'something" (onChange)="onSortChange($event)" [style]="{'min-width':'140px'}"></p-dropdown>

pInputText that works for filtering:

<input type="search" pInputText placeholder="Filter by x" (input)="dv.filter($event.target.value)">

Dropdown that is not working:

<p-dropdown [options]="units" optionLabel="label" 
  (onChange)="dv.filter($event.target.value)" placeholder="Unit" styleClass="ui-column-filter" [showClear]="true">                           
  <ng-template let-option pTemplate="item">                                
    <span>{{option.value.label}}</span>
  </ng-template>
</p-dropdown>

I'm receiving ERROR TypeError: $event.target is undefined. It's confusing to me because the very same syntax works when it's a text input, but not the dropdown.

0

There are 0 best solutions below