Issue
Is it possible to remotely clear a multi-select (or multiple multi-selects) with a button? I'm using primeng multi-select with turbo table
I've seen this question a few times, but not with a selected answer.
Below is my multi-select:
<span *ngIf="col.field == 'Product'">
<p-multiSelect [options]="getUniques(col.field)"
(onChange)="dt.filter($event.value, col.field, 'in')">
</p-multiSelect>
</span>
Here is my button:
<p-button label="Clear All"
styleClass="ui-button-primary"
(click)="onResetAll($event, dt)">
</p-button>
Here is the method, where I try to reset values, but does not seem to reset:
onResetAll(event, dt) {
dt.filter('', 'Product', 'contains');
}
Solution
Below for multi multiselect
First set view children selector #cmp
<p-multiSelect #cmp [options]="cars" appendTo="body"
(onChange)="table.filter($event.value, 'brand', 'in')">
</p-multiSelect>
In code behind declare setof components
@ViewChildren('cmp') components: QueryList<MultiSelect>;
And update your button click event
onResetAll(event, dt) {
this.components['_results'].forEach(ds => {
ds.value = null;
ds.updateLabel();
});
dt.filter('', 'brand', 'contains');
}
Demo here
Answered By - phucnh
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.