I am working with a DataTable that includes a column called Timestamp:
<p-dataTable sortMode="multiple" scrollable="scrollable" scrollHeight="150" [value]="currentChartData" #dt>
<p-column field="timestamp" header="Timestamp" [sortable]="true" [filter]="true">
<ng-template pTemplate="filter" let-col>
<div class="d-flex flex-row flex-wrap justify-content-center align-content-center">
<div style="padding-right: 29px">
<p-calendar [(ngModel)]="from" [showTime]="true"
(onSelect)="filter(dt, 'from')"
(onClearClick)="filter(dt, 'from')"
showButtonBar="true" readonlyInput="true"
[inputStyle]="{'width': '8em'}" styleClass="ui-column-filter" appendTo="body"
dateFormat="dd.mm.yy">
</p-calendar>
</div>
<div style="padding-right: 29px">
<p-calendar [(ngModel)]="to" [showTime]="true"
(onSelect)="filter(dt, 'to')"
(onClearClick)="filter(dt, 'to')"
showButtonBar="true" readonlyInput="true"
[inputStyle]="{'width': '8em'}" styleClass="ui-column-filter" appendTo="body"
dateFormat="dd.mm.yy">
</p-calendar>
</div>
</div>
</ng-template>
<ng-template let-row="rowData" pTemplate="body">
{{row.timestamp.toLocaleString()}}
</ng-template>
</p-column></p-dataTable>
Using two calendars for the filterfields "from" and "to," I aim to filter rows between two specific dates.
The filter function implementation is as follows:
between(value: any, from: any, to: any): boolean {
if (from === undefined || from === null) {
return true;
}
if (to === undefined || to === null) {
return false;
}
if ((from === undefined || from === null ||
(typeof from === 'string' && from.trim() === '') || from <= value) &&
(to === undefined || to === null ||
(typeof to === 'string' && to.trim() === '') || to >= value)) {
return true;
}
return false;
};
Typically, filtering on the datatable involves using dt.filter()
.
How can this be customized to filter based on my custom between function?
What exactly does dt.filter()
return?